I'm quite a newbie with annyang. I'm trying to add a Greensock Timeline in a annyang command, but it is not working. I am wondering if it is not possible or if I'm doing something wrong.
This is the code were it is about:
var tlcrocodile = new TimelineLite({paused:true});
if (annyang) {
var commands = {
'hello': function() {
tlcrocodile.to(".crocodile_1", 0.3 , {x:+40} , 0);
}
};
annyang.addCommands(commands);
annyang.start();
}
Hopefully someone can help me. Thanks in advance!
Ilse
It seems like your TimelineLite instance never play because you instantiate it as paused but you never call play() on it.
Try instantiating it directly inside the hello command, when you need it to play.
And add a console log to make sure your command was really triggered.
if (annyang) {
var commands = {
'hello': function() {
console.log('Hello command executed.');
new TimelineLite().to(".crocodile_1", 0.3 , {x:+40} , 0);
}
};
annyang.addCommands(commands);
annyang.start();
}
Related
Let's assume I have a service function that returns me the current location. And the function has callbacks to return the location. We can easily mock the function like as follows. But I wanted to introduce some delay (let's say 1 sec) before the callFake() invokes the successHandler(location).
Is there a way to achieve that?
xxxSpec.js
spyOn(LocationService, 'getLocation').and.callFake(function(successHandler, errorHandler) {
//TODO: introduce some delay here
const location = {...};
successHandler(location);
}
LocationService.js
function getLocation(successCallback, errorCallback) {
let location = {...};
successCallback(location);
}
Introducing delay in Javascript is easily done with the setTimeout API, details here. You haven't specified if you are using a framework such as Angular, so your code may differ slightly from what I have below.
It does not appear that you are using Observables or Promises for easier handling of asynchronous code. Jasmine 2 does have the 'done' callback that can be useful for this. Something like this could work:
it( "my test", function(done) {
let successHandler = jasmine.createSpy();
spyOn(LocationService, 'getLocation').and.callFake(function(successHandler, errorHandler) {
setTimeout(function() {
const location = {...};
successHandler(location);
}, 1000); // wait for 1 second
})
// Now invoke the function under test
functionUnderTest(/* location data */);
// To test we have to wait until it's completed before expecting...
setTimeout(function(){
// check what you want to check in the test ...
expect(successHandler).toHaveBeenCalled();
// Let Jasmine know the test is done.
done();
}, 1500); // wait for longer than one second to test results
});
However, it is not clear to me why adding the timeouts would be valuable to your testing. :)
I hope this helps.
I'm trying to create an end-2-end test suite using nightwatch.js
I've looked around a bit and haven't really figured out how to use a pageBase, like is usually used when implementing POM.
I'm using the page_object that is built in to nightwatch, but can't seem to get it to use a pageBase.
Here is the code example.
To simplify things, let's say I have a common.js file, and a test.js file
I want test.js to inherit all of common.js commands and elements and implement some commands and elements of it's own, but I'm struggling with the syntax.
this is the common.js file
let commonCommands = {
clickOnMe: function () {
return this.waitForElementVisible('#someElement', 2000)
}
};
module.exports = {
commands: [commonCommands],
elements: {
someElement: '#elementId'
},
};
this is the test.js file
const common = require('./common');
let testCommands = {
doStuffFromTest: function () {
return this;
}
};
module.exports = {
url: function () {
return this.api.launch_url ;
},
commands: common.commands,
elements: common.elements
};
How can I add commands and elements to the test.js ?
You generally don't want to access those commands from your test, but rather from your other page objects. Since that's where all of your commands will be happening, common actions like clicking on an element or checking if something is present will be done at the page object level.
Trying to get some help with this code block.
My script first looks for a specific folder and if it exists the pass the id of the folder to the google.picker.DocsUploadView(). When I hard-code the value of setParent to 'gdfid', everything works well. On the other hand, I need the code to be parameterized.
thanks in advance for any assistance
Pete
here's my code:
var gdfid;
function createPicker() {
if (pickerApiLoaded && oauthToken) {
gapi.client.drive.files.list({
"corpora": "user",
"spaces": "drive",
"fields": "files(id,name)",
"q": "name = 'myUploads"
}).then(function(response) {
console.log( response.result.files.length );
if (response.result.files.length > 0) {
console.log( response.result );
gdfid = response.result.files[0].id;
}
//alert('Folder ID: ' + gdfid);
});
var picker = new google.picker.PickerBuilder().
setTitle('Upload to myPratt Folder').
enableFeature(google.picker.Feature.MULTISELECT_ENABLED).
enableFeature(google.picker.Feature.NAV_HIDDEN).
addView(new google.picker.DocsUploadView().
setIncludeFolders(false).
setParent('gdfid')). //tried with and without quotes
setOAuthToken(oauthToken).
setDeveloperKey(developerKey).
setCallback(pickerCallback).
build();
picker.setVisible(true);
}
}
It's probably the .then{} promise code block. I've had lots of trouble with them. The problem is that the .then{} code block has a closed scope.
When you assign gdfid = response.result.files[0].id; it's assumed that it is changing the global variable. But it isn't. It's only creating a local version of gdfid.
I ran around in circles myself for ages trying to figure out how to save external state information from within a .then{} block. Any possible solutions I came up with, were invariably no better than the callback hell that promises were supposed to solve in the first place. I even had problems returning objects out from it. I think the problem is that a .then{} block needs to run from a returned promise. Promises are actually functions earmarked to run in the future. They are subject to scoping restrictions, because they cannot make assumptions about the state of code outside the function. And they only pass object/variables a certain way. Trying to assign globals or returning data the regular way, from inside the .then{} block, is fraught with problems. It will often leave you tearing your hair out.
Try refactoring your code into a function with async/await, and use a try-catch statement to capture promise fails (Note: The try-catch statement still suffers from the global variable isolation problem, but at least it seems to be solely within the catch block. This is only an issue when an error occurs). I find async await much cleaner and easier to understand, and the scoping of variables works more intuitively.
In your case you could rewrite the code thus:
function async createPicker() {
var gdfid;
if (pickerApiLoaded && oauthToken) {
try {
var response = await gapi.client.drive.files.list({
"corpora": "user",
"spaces": "drive",
"fields": "files(id,name)",
"q": "name = 'myUploads"
});
console.log( response.result.files.length );
if (response.result.files.length > 0) {
console.log( response.result );
gdfid = response.result.files[0].id;
}
//alert('Folder ID: ' + gdfid);
var picker = new google.picker.PickerBuilder()
.setTitle('Upload to myPratt Folder')
.enableFeature(google.picker.Feature.MULTISELECT_ENABLED)
.enableFeature(google.picker.Feature.NAV_HIDDEN)
.addView(new google.picker.DocsUploadView()
.setIncludeFolders(false)
.setParent(gdfid)) //tried with and without quotes
.setOAuthToken(oauthToken)
.setDeveloperKey(developerKey)
.setCallback(pickerCallback)
.build();
picker.setVisible(true);
} catch (e) {
console.log("Error displaying file list");
}
};
}
The only real difference here, is the await in front of the gapi.client.drive.files
function forces the code to wait for a callback to assign the response variable. This is not too much of a slowdown issue when running single popup UI elements that the user interacts with.
The gdfid variable is no longer global. In fact you don't even need it. You could setParent directly from the response variable.
I've been able to add a list of suggestions to autocomplete but there is a large list of other suggestions as well.
Is there a way to get rid of the default autocomplete suggestions?
I'm looking at the source here and here and it doesn't describe anything about it. Here is what I have so far:
public function codeCompleter(editor, session, position, prefix, callback):void {
var row:int = position.row;
var column:int = position.column;
if (prefix.length === 0) {
callback(null, []);
}
var testing:Boolean = false;
if (testing) {
callback(null, attributes);
}
else {
callback(null, [{value:"addedToStage"},{value:"test"},{value:"test1"},{value:"adding"},{value:"added"}]);
}
}
I tried setting the completers to an empty array but no effect:
editor.setCompleters([]);
The problem was on my end. The version I was using must have been outdated. I updated to a newer version and the following code clears the auto complete list:
// either line does it
languageTools.setCompleters(null);
languageTools.setCompleters([]);
FYI:
Using version 1.2.6+, 12.03.2016
PS Sorry to anyone looking into this. I will post version numbers in future questions.
When I try to debug react native, it usually looks like this.
at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext (ReactCompositeComponent.js:785)
at ReactCompositeComponentWrapper._renderValidatedComponent (ReactCompositeComponent.js:811)
at ReactCompositeComponentWrapper._updateRenderedComponent (ReactCompositeComponent.js:735)
at ReactCompositeComponentWrapper._performComponentUpdate (ReactCompositeComponent.js:715)
at ReactCompositeComponentWrapper.updateComponent (ReactCompositeComponent.js:634)
at ReactCompositeComponentWrapper.receiveComponent (ReactCompositeComponent.js:534)
at Object.receiveComponent (ReactReconciler.js:131)
at ReactCompositeComponentWrapper._updateRenderedComponent (ReactCompositeComponent.js:737)
There are no useful information and if I use debugger command to see what initiated the 50-depth call stack, then it almost always comes down to the onmessage method in `debuggerWorker.js', and it's almost zero useful.
How do you really debug your react native app?
onmessage = function(message) {
var object = message.data;
var sendReply = function(result) {
postMessage({replyID: object.id, result: result});
};
var handler = messageHandlers[object.method];
if (handler) {
// Special cased handlers
handler(object, sendReply);
} else {
// Other methods get called on the bridge
var returnValue = [[], [], [], 0];
try {
if (typeof __fbBatchedBridge === 'object') {
returnValue = __fbBatchedBridge[object.method].apply(null, object.arguments);
}
} finally {
sendReply(JSON.stringify(returnValue));
}
}
};
I tend to use the stack traces to figure out the general area where the error occurred and then use the web debugger to actually find out what when wrong.
https://facebook.github.io/react-native/docs/debugging.html#chrome-developer-tools
Its actually pretty nice, you can open all your js files in the sources tab of the chrome dev tools and then put debug points in and just step through your file and view your variables.