Strange problem with Q and durandal 2.1
When i follow the instructions in Durandal docs and insert
system.defer = function (action) {
var deferred = Q.defer();
action.call(deferred, deferred);
var promise = deferred.promise;
deferred.promise = function() {
return promise;
};
return deferred;
};
When i click on a link that uses the router it freaks out:
[Q] Unhandled rejection reasons (should be empty):
["TypeError: undefined is not a function↵ at Obje…lhost:9020/Scripts/knockout-2.3.0.debug.js:954:38"]
0: "TypeError: undefined is not a function↵
at Object.composition.executeStrategy
(http://localhost:9020/Scripts/durandal/composition.js:593:39)↵
at Object.composition.inject
(http://localhost:9020/Scripts/durandal/composition.js:622:22)↵
at Object.composition.compose (http://localhost:9020/Scripts/durandal/composition.js:681:29)↵
at ko.bindingHandlers.router.update (http://localhost:9020/Scripts/durandal/plugins/router.js:1122:29)↵
at http://localhost:9020/Scripts/knockout-2.3.0.debug.js:2155:33↵
at Object.ko.utils.objectForEach (http://localhost:9020/Scripts/knockout-2.3.0.debug.js:54:17)↵
at ko.dependentObservable.disposeWhenNodeIsRemoved (http://localhost:9020/Scripts/knockout-2.3.0.debug.js:2151:34)↵
at evaluateImmediate (http://localhost:9020/Scripts/knockout-2.3.0.debug.js:1270:41)↵
at evaluatePossiblyAsync [as callback] (http://localhost:9020/Scripts/knockout-2.3.0.debug.js:1236:13)↵
at http://localhost:9020/Scripts/knockout-2.3.0.debug.js:954:38"
length: 1
__proto__: Array[0]
I am not sure what is causing the problem but if i comment out the [Q] patch it works perfectly. Is this a durandal 2.1 issue?
Related
I would like to ask for some help with my javascript code.
When my trigger is an tag and plain text inside it, it works. But for structural reasons I had to use a tag inside my , and that way I'm getting an error, "Uncaught (in promise) TypeError: src is undefined".
Here's the part of the JS code that the error is referring to:
// destructure values
const { link, src, artist, title, moodcover } = e.target.dataset;
const peaksSrc = src.replace('.mp3', '.json');
const res = await fetch(peaksSrc);
const { data: peaks } = await res.json();
wavesurfer.load(src, peaks);
document.body.scrollTop = 0;
What would be the solution for this problem?
Thanks in advance!
I've tried using or instead of , but that didn't help.
I'm using my own example of Syncfusion upload. Here's the Stackblitz which WORKS and I designed 3 years ago.
So, what's the problem? Well, in my latest project, using Angular13 and the same version of Syncfusion, 18.2.44, the ejs-uploader is not rendering.
Here's the graphics:
And the CODE in VSCode
ERROR in the debug console.
public dropElement!: HTMLElement;
ngAfterViewInit(): void {
let self = this;
this.dropElement = document.getElementsByClassName(
'control_wrapper'
)[0] as HTMLElement;
(document.getElementsByClassName('e-btn')[0] as any).style.display = 'none';
setTimeout(function () {
(document.getElementById('full') as any).onclick = (args: any) => {
console.log('Args afterViewInit: ', args);
self.uploadObj.upload(self.uploadObj.getFilesData());
};
}, 5000);
}
WHAT I DID:
This line above: self.uploadObj.upload(self.uploadObj.getFilesData()); FINDS the function nicely in VSCode but when I run the app at compile time, it's UNDEFINED.
Syncfusion support suggested I use the wrapper of (document.getElementById('full') as any) and not just: document.getElementById('full') wherever I call or reference an element. It works in Stackblitz but SHOULD in my code.
BUT it doesn't in my project.
All I see in the debug console is . If you check INSPECT in the debug console in Stackblitz, however, you'll see it fully rendered.
It is an example whose title is "images-breadthfirst-layout" in cytoscape js
(https://github.com/cytoscape/cytoscape.js/blob/unstable/documentation/demos/images-breadthfirst-layout/code.js)
cy.on('tap', 'node', function(){
var nodes = this;
var tapped = nodes;
var food = [];
nodes.addClass('eater');
for(;;){
var connectedEdges = nodes.connectedEdges(function(el){ <-- here
return !el.target().anySame( nodes );
});
When i run this example, I have this error in chrome:
code.js:106 Uncaught TypeError: el.target is not a function
at a.<anonymous> (code.js:106)
at s.filter (cytoscape.min.js:18)
at a.connectedEdges (cytoscape.min.js:18)
at a.<anonymous> (code.js:105)
at u.<anonymous> (cytoscape.min.js:19)
at a.<anonymous> (cytoscape.min.js:19)
at t (cytoscape.min.js:21)
at cytoscape.min.js:21
how can i solve this problem?
Make sure to download Cytoscape only from the master branch or from npm. Similarly, make sure to use the demo code only from the master branch.
The docs link only to the master branch.
i want to check the returned value of $http.get() but i get undefined value. Here is my vue js code:
var vm = new Vue({
el: '#permissionMgt',
data: {
permissionID: []
},
methods:{
fetchPermissionDetail: function (id) {
this.$http.get('../api/getComplaintPermission/' + id, function (data) {
this.permissionID = data.permissionID; //permissionID is a data field of the database
alert(this.permissionID); //*****this alert is giving me undefined value
});
},
}
});
Can you tell me thats the problem here?.. btw $http.get() is properly fetching all the data.
You need to check what type is the data returned from the server. If #Raj's solution didn't resolve your issue then probably permissionID is not present in the data that is returned.
Do a colsole.log(data) and check whether data is an object or an array of objects.
Cheers!
Its a common js error. Make the following changes and it will work.
fetchPermissionDetail: function (id) {
var self = this; //add this line
this.$http.get('../api/getComplaintPermission/' + id, function (data) {
self.permissionID = data.permissionID; //replace "this" with "self"
});
},
}
the reason is this points to window inside the anonymous function function()
This is a well known js problem. If you are using es2015 you can use arrow syntax (() => { /*code*/ }) syntax which sets this correctly
I'm trying to use PhantomJS with a script that's compiled by Babel from ES6 to ES5.
For some of the features, Babel puts in some helper functions at the end of the file (like _asyncToGenerator and _typeof) to evaluate the code.
But in Phantom, there's a function evaluate(function(){…}) which is executed in the browser context, so it doesn't have access to those helper functions babel puts in.
Ex, if I have a code:
var page = require('webpage').create();
page.open(url, function(status) {
var title = page.evaluate(function() {
typeof(document.title);
});
});
It compiles to
var page = require('webpage').create();
page.open(url, function(status) {
var title = page.evaluate(function Executed_in_Browser_Context() {
_typeof(document.title);
});
});
function _typeof(obj) { return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj; }
Notice the typeof has been changed to _typeof (for some feature involving ES6 Symbols)
Here, the function Executed_in_Browser_Context is executed in browser context, and so it doesn't have access to the function _typeof defined in the file at the bottom. And so it results in error
Can't find variable: _typeof
How to solve this?
I tried copying the _typeof inside Executed_in_Browser_Context (pre-compilation) but then upon compiling, Babel sees that and thinks that it may be some other function that I have in my code, and just renames its own to _typeof2 resulting in same error.