I am passing an HTML string to PhantomJSCloud in the "content" of the page. The HTML has JS embedded in it inside script tags at the end of the string. When I return the jpeg that I am requesting from PJSC, the objects that the JS manipulates, have not been manipulated. I know the js works, because I can copy and paste the whole html string to a file, open it in chrome, and watch it happen.
It is using Chart.js, which has an animation option, but i have set it to false.
Currently my request JSON looks like this:
"pages": [
{
"content": "$$$CONTENT$$$",
"renderSettings": {
"quality": 100,
"selector": "[id='report']"
},
"requestSettings": {
"ioWait": 5000,
"waitInterval": 5000
}
}
]
}
Replacing the "$$$CONTENT$$$" with my actual HTML string. The whole request takes less than 5 seconds so the "waitInterval" doesn't seem to be what I'm looking for.
This turned out to not be an issue of whether it was waiting on the javascript. My javascript was manipulating text, and some of that text had a \n inside of it. It apparently needed a \\\n
Related
I added Extent Report 5 to tests and attached spark reporter to it, all in all it looks good, however I take result.getThrowable().getMessage() and it does not apply \n\r or \n in resulting index.html.
I know that it happens somewhere after flush is called, since in log list it still have the correct string with all characters. Also, if I send to fail() method getThrowable() itself it will be written correctly, but it have unnessessary data - exception and stack trace.
For reference my spark-config file looks like this:
{
"documentTitle": "Extent Reports Title",
"encoding": "utf-8",
"js": "",
"offlineMode": true,
"protocol": "HTTPS",
"reportName": "ExtentReportsName",
"timelineEnabled": false,
"timeStampFormat": "MMM dd, yyyy HH:mm:ss",
"theme": "dark"
}
The only other way I know is to send your input wrapped in <pre></pre> tags.
You can use the below technique which will keep your formatting intact.
test.fail(result.getThrowable());
I'm trying to make a simple webpage in Vuejs.
I have a Main.vue page, which has an import of a json file, and this json file contains certain parameters. One of them is an object array, each of its elements has a string indicating the page to be shown next in a sequence. The page also fetches data from that object.
So, the Main.vue can access to every field and object of the json file file and shows the pages (page1, page2, page3...) in a sequence, depending on the information stored at that object array.
These pages (page1, page2, page3...) need to be generic, with no reference to a specific json file, and need to show information from that specific object of the array of the json.
I know how to pass data to pages via URL (so, for example, "page1" knows which element of the array has to fetch info from because Main.vue specifies it in the URL) but I don't know how can I make MyJson accesible to "page1", "page2" without making an import sentence of MyJson in each page.
I do not have backend or something similar, just a frontend which executes entirely in the browser.
I was wondering whether there is any way of accessing MyJson from page1, page2, page3... without having a backend.
Many thanks in advance
Regards
Miguel
I have tried it by passing info via URL, but it didn't work out as expected.
PS: This is my json
MyJson.json
{
"id"="whatever"
"text"="whatever"
"myArray"=[
{
"whichPageHasToRenderMe"="page1"
"myData"= ...
...
},
{
"whichPageHasToRenderMe"="page2"
"myData"= ...
...
},
{
"whichPageHasToRenderMe"="page1"
"myData"= ...
...
},
{
"whichPageHasToRenderMe"="page1"
"myData"= ...
...
}
]
}
If you serve your json file as static file. You can use fetch api or any other fetch library to access your json file.
fetch('path/to/your.json')
.then(response => response.json())
.then(data => {
// do something
})
See more about Fetch API.
In case you want to pass some json data as url query. Don't forget to use encodeURIComponent or btoa to escape some special characters.
window.open('/some/path?data=' + encodeURIComponent(JSON.stringify(data)))
I have solved it by using Vuex and setting the JSON in the state of Vuex, so it can be accessible from other pages.
If I understand the docs correctly…
window.queue = new createjs.LoadQueue(true, null, true);
queue.loadManifest({src: manifest, type: "manifest"}, true);
should be loading the files that are located in the json file, correct? Not seeing any requests in inspector, only getting the results array in console. Do I have to loop over results array and do the loadFile manually?
JSON is formatted correctly in a {src:"",id:"",type:"createjs.Types.IMAGE"} structure.
Any help is appreciated.
Adding more code:
function to pass in manifest url
function loadImages(manifest) {
window.queue = new createjs.LoadQueue(true, null, true);
queue.loadManifest({src: manifest, type: "manifest"}, true);
queue.on("fileload", this.handleFileLoaded);
queue.on("progress", function(event) {
console.log("progress " + event.progress);
});
queue.on("fileprogress", function(event) {
console.log("file progress " + event.progress);
});
queue.on("error", function(event) {
console.log("file error");
});
queue.on("complete", function(event) {
console.log("queue complete");
console.log(event);
});
queue.load();
return queue;
}
handleFileLoaded event is just dumping event to console at this point.
Manifest with two examples
{
"path":"https://images.unsplash.com/",
"type":"manifest",
"manifest": [
{
"src":"photo-1542838454-d4dce2a7cfde?fit=crop&w=500&q=60",
"id":"stair_boy",
"type":"createjs.Types.IMAGE"
},
{
"src":"photo-1549948558-1c6406684186?fit=crop&w=500&q=60",
"id":"night_bridge",
"type":"createjs.Types.IMAGE"
}
]}
I get access to the manifest array in the fileload event, I can manually load the images from there, but that seems counterintuitive to the whole point of using the PreloadJS. Seems like on page load, Preload should load the manifest, recognize 'type'… loop through files and in network inspector I should see the web requests for the images.
The types in your manifest are incorrect. You are passing in a string value of "createjs.Types.IMAGE". This is not equal to "image", nor is it the equivalent of the JavaScript createjs.Types.IMAGE, since it is interpretted as a string.
Instead use the string value "image"
{
"path":"https://images.unsplash.com/",
"type":"manifest",
"manifest": [
{
"src":"photo-1542838454-d4dce2a7cfde?fit=crop&w=500&q=60",
"id":"stair_boy",
"type":"image"
},
{
"src":"photo-1549948558-1c6406684186?fit=crop&w=500&q=60",
"id":"night_bridge",
"type":"image"
}
]}
Edit: The type property is only required when there is not a recognizable image extension, such as this case.
From the docs:
The loadManifest call supports four types of manifests:
A string path, which points to a manifest file, which is a JSON file that contains a "manifest" property, which defines the list of files to load, and can optionally contain a "path" property, which will be prepended to each file in the list.
An object which defines a "src", which is a JSON or JSONP file. A "callback" can be defined for JSONP file. The JSON/JSONP file should contain a "manifest" property, which defines the list of files to load, and can optionally contain a "path" property, which will be prepended to each file in the list.
An object which contains a "manifest" property, which defines the list of files to load, and can optionally contain a "path" property, which will be prepended to each file in the list.
An Array of files to load.
Your example uses the first approach. If something is not working, then feel free to post more code.
You could always throw some more events on your queue to see what is happening, such as "fileststart", "fileload", and "error". You should get at least one event when the first manifest starts loading.
Cheers.
I tried to supply test data to nightwatch but i don't know how. How to supply any dynamic test data to Nightwatch testing?
I don't want to hardcoded the value into the code. I want to supply it from file.
EDIT:
.setValue('selector', 'DEBBIE A/P EKU')
Since you mentioned it in one of your comments you want to read the values from a file, I recommend you doing it via pseudo-JSON (actually .js). Also a solution I applied in my company.
I have multiple json files which contain certain test data that I didn't want to have in the code. The basic structure of those looks like this:
module.exports = {
WHATEVER_IDENTIFIER_I_WANT: 'Some shiny value'
}
My Page Object contains a line like this:
const STATIC = require('path/to/static/file')
…
.setValue('selector', STATIC.WHATEVER_IDENTIFIER_I_WANT)
And yea, it is not highly sophisticated but it fulfils the purpose.
If you don't want to use module.exports and .js you can still use some node methods to load and parse a JSON. E.g.
fs.readFileSync / fs.readFile (to load the JSON file)
const file = fs.readFileSync('path/to/file')
JSON.parse() (to retrieve a JavaScript Object)
const STATIC = JSON.parse(file)
Hope this is useful for you :)
I've been through the same issue. At the moment my set up is like this:
Raw data are in the excel sheet. I use node.js to convert excel sheet into json file. Then use json data in nightwatch.
Here is the code to read the json file in nightwatch:
module.exports = {
tags: ['loginpage'],
// if not regular size logout button is not visible
'Login' : function (client) {
var credentials;
try{
credentials = require('./path/to/inputJsonData.json');
} catch(err) {
console.log(err);
console.log ('Couldn\'t load the inputJsonData file. Please ensure that ' +
'you have the inputJsonData.json in subfolder ./path/to ' +
'in the same folder as the tests');
process.exit();
}
Here is the code that use data from it:
client
.url(credentials.url)
.waitForElementVisible('body', 1000)
.assert.title('Sign In Home Page')
.login(credentials.username,credentials.password)
// some more steps here
.logout()
.end();
}
};
inputJsonData.json data
{
"url": "http://path/to/my/input/credentials/file",
"username": "yourUserName",
"password": "yourPassword"
}
My problem/question:
How to find the count of elements read into the json object from a file when the file has following format?:
[
{
....
},
{
....
},
.....
{
....
}
]
My failed attempt to get the number of elements: JSON.parse(company).count where company is another json read file like credentials in above code.
Answer: use standard javascript array property length company.length
TheBayOr answered the question concisely regarding the use of files. Just to add that if you don't literally mean a non 'code' file but simply using a different location to store the values then the most common approach is using globals.
You can place an array of values in either your nightwatch.json...
"test_settings" : {
"default" : {
"selenium_port" : 4444,
"selenium_host" : "localhost",
"silent": true,
"globals" : {
"VARIABLE_1" : "i'm a variable",
"VARIABLE_2" : "i'm a variable too"
},
"desiredCapabilities": {
"browserName": "chrome",
"javascriptEnabled": true,
"acceptSslCerts": true
}
},
"other_environment" : {
"globals" : {
"VARIABLE_1" : "i'm a different variable",
"VARIABLE_2" : "i'm a different variable too"
You can use them in tests with something like....
.url(browser.globals.VARIABLE_1)
Notice in the above you can have sets of globals under different environments. This has the advantage of meaning you can have multiple sets and use the one you want by running nightwatch -e 'my desired environment'.
Similarly this can be achieved by putting your array of data in a globals file e.g. globals.js and referencing it in your 'globals.path'.
If you want to get really into it you can even store your variables in global.js then use the 'fs' library to write the values to a file, then have your tests read from there. I'd recommend a new question if thats what you intend.
Hopefully that adds something :)
In my case I just created a function which read variables , data ,etc
more details here: https://stackoverflow.com/a/64616920/3957754
I'm using magnific popup and ajax loading content into it and passing values to the ajax content by appending a query string to the url, which works fine except in IE7 (and probably IE8 as well). The reason is very likely the length of the query string, because it works when I shorten it.
So my question is, is it possible to pass it via some sort of data setting and make it use POST instead of GET. Or does it already use post and I just need to use the right method.
This is what I have:
$.magnificPopup.open({
tLoading:"",
modal:false,
type:'ajax',
alignTop:true,
items:{src:urlContainingVeryLongQueryString},
callbacks:
{
ajaxContentAdded:function()
{
...
My test url is 906 characters long in total (well within IE7's 2000ish limit).
ajax.settings option http://dimsemenov.com/plugins/magnific-popup/documentation.html#ajax_type is passed to jQuery.ajax method http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings , e.g.:
$.magnificPopup.open({
tLoading:"",
modal:false,
type:'ajax',
alignTop:true,
items:{src:'http://example.com/ajax'},
ajax: {
settings: {
type: 'POST',
data: {
foo: 'bar'
}
}
}
});