All geek questions in one place

Phantoms and Requirements

The codes in the main.js file are as follows:

phantom.injectJs("libs/require-1.0.7.js"); require.config( { baseUrl: "" } ); require([], function(){});

when I run "phantomjs main.js" on the command line, requirejs does not work well in main.js. I know how to use requirejs on a page running in a browser (including the phantomjs method: page.open (url, callback)), but not as described above. I am trying to use requirejs like main.js, this is a popular problem, I think. Thanks!

+6
source share
2 answers

I just struggled for some time. My solution is not clean, but it works, and I am pleased that due to the unfinished api documentation from phantomjs.

Wordy explanation

You need three files. One of them is your test amd phantomjs file, which I will name "amd.js". Your second html download page, which I will call amd.html. Finally, a browser tester, which I called "amdTestModule.js".

In amd.html declare the script tag as normal:

 <script data-main="amdTestModule.js" src="require.js"></script>

In your phantomjs test file, this is where it gets hacked. Create your page and load the 'fs' module. This allows you to open the relative path to the file.

 var page = require('webpage').create(); var fs = require('fs'); page.open('file://' + fs.absolute('tests/amd.html'));

Now, since requirejs loads files asynchronously, we cannot just pass the callback to page.open and expect everything to go smoothly. We need some way either 1) Check our module in the browser and report the result back to our phantomjs context. Or
2) Tell our phantomjs context that after loading all resources to run the test.

# 1 was easier for my case. I did it through:

 page.onConsoleMessage = function(msg) { msg = msg.split('='); if (msg[1] === 'success') { console.log('amd test successful'); } else { console.log('amd test failed'); } phantom.exit(); };

** See the full code below for my console.log post.

Now phantomjs seems to have an api event inline, but it is undocumented. I was also able to successfully receive request / response messages from their page.onResourceReceived and page.onResourceRequested - this means that you can debug when all the necessary modules are loaded. However, to report my test result, I just used console.log.

Now, what happens if the console.log message never starts? The only way I could think of this is to use setTimeout

 setTimeout(function() { console.log('amd test failed - timeout'); phantom.exit(); }, 500);

That should do it!

Full code

Structure

 /projectRoot /tests - amd.js - amdTestModule.js - amd.html - require.js (which I symlinked) - <dependencies> (also symlinked)

amd.js

 'use strict'; var page = require('webpage').create(); var fs = require('fs'); /* page.onResourceRequested = function(req) { console.log('\n'); console.log('REQUEST'); console.log(JSON.stringify(req, null, 4)); console.log('\n'); }; page.onResourceReceived = function(response) { console.log('\n'); console.log('RESPONSE'); console.log('Response (#' + response.id + ', stage "' + response.stage + '"): ' + JSON.stringify(response, null, 4)); console.log('\n'); }; */ page.onConsoleMessage = function(msg) { msg = msg.split('='); if (msg[1] === 'success') { console.log('amd test successful'); } else { console.log('amd test failed'); } phantom.exit(); }; page.open('file://' + fs.absolute('tests/amd.html')); setTimeout(function() { console.log('amd test failed - timeout'); phantom.exit(); }, 500);

amd.html

 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> <script data-main='amdTestModule.js' src='require.js'></script> </body> </html>

amdTestModule.js

 require([<dependencies>], function(<dependencies>) { ... console.log( (<test>) ? "test=success" : "test=failed" ); });

console

 $ phantomjs tests/amd.js amd test successful
+2
source

you misunderstand webpage.injectJs ()

to enter scripts on the page to load, and not in the phantomjs runtime.

Thus, using .injectJs () makes loading requirejs into your page, not into phantomjs.exe.

However, the phantomjs runtime has aproximation of commonjs. RequireJs will not work there by default. If you feel that you are especially (VERY) motivated, you can try porting the required measurement for nodejs, but it does not work out of the box and will require an incredibly deep understanding of the runtime. for more details: http://requirejs.org/docs/node.html

best idea: probably you should make sure you have the javascript JavaScript versions you want to run. I personally write my code in typescript, so I can build for commonjs or amd. I am using commonjs for phantomjs and amd code for nodejs and browser.

+1
source

Source: https://habr.com/ru/post/919009/

More articles:


All Articles