Develop Reference

MathJax in Android WebView - injecting the script after the HTML page is loaded

I have to add MathJax functionality to my app.
According to some examples the correct script to be added is
<script type='text/x-mathjax-config'>"
+"MathJax.Hub.Config({ "
+ "showMathMenu: false, "
+ "jax: ['input/TeX','output/HTML-CSS'], "
+ "showProcessingMessages: false, "
+ "messageStyle: 'none', "
+ "extensions: ['tex2jax.js'], "
+ "TeX: { extensions: ['AMSmath.js','AMSsymbols.js',"
+ "'noErrors.js','noUndefined.js'] } "
+ "});</script>"
+ "<script type='text/javascript' "
+ "src='file:///android_asset/MathJax/es5/tex-mml-svg.js'"
+ "></script><span id='math'></span>
The script is loaded from local folder inside the Asset directory.
I have to add that script to a local HTML file when loaded in the Android WebView from another folder on the filesystem (private app folder).
The HTML page has math formulas inside that have to be read by the MathJax functions.
I cannot inject the script as a tag in the HTML file before loading. But also the rendering of the formulas have to be performed immediately after loading.
In the examples they suggest something like:
webView.loadDataWithBaseURL("http://bar", "<script type='text/x-mathjax-config'>"
+"MathJax.Hub.Config({ "
+ "showMathMenu: false, "
+ "jax: ['input/TeX','output/HTML-CSS'], "
+ "showProcessingMessages: false, "
+ "messageStyle: 'none', "
+ "extensions: ['tex2jax.js'], "
+ "TeX: { extensions: ['AMSmath.js','AMSsymbols.js',"
+ "'noErrors.js','noUndefined.js'] } "
+ "});</script>"
+ "<script type='text/javascript' "
+ "src='file:///android_asset/MathJax/es5/tex-mml-svg.js'"
+ "></script><span id='math'></span>","text/html","utf-8","");
That instruction is executed after the page is loaded, followed by
webView.evaluateJavascript("MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
that I think is the instruction to render all the math tags in the document
but I get
I/chromium: [INFO:CONSOLE(1)] "Uncaught ReferenceError: MathJax is not defined"
What is the correct way to inject the script in the loaded page and perform the rendering?

The solution for my case was the following code
String scriptText=
"MathJax.Hub.Config({ "
+ "showMathMenu: false, "
+ "jax: ['input/TeX','output/HTML-CSS'], "
+ "showProcessingMessages: false, "
+ "messageStyle: 'none', "
+ "extensions: ['tex2jax.js'], "
+ "TeX: { extensions: ['AMSmath.js','AMSsymbols.js',"
+ "'noErrors.js','noUndefined.js'] } "
+ "});";
String js_command = "var newScript = document.createElement(\"script\");"
+"newScript.setAttribute('type','text/x-mathjax-config');"
+"var inlineScript = document.createTextNode(\""+scriptText+"\");"
+"newScript.appendChild(inlineScript);"
+"document.body.appendChild(newScript);"
+"newScript = document.createElement(\"script\");"
+"newScript.setAttribute('type','text/javascript');"
+"newScript.setAttribute('src','file:///android_asset/MathJax/es5/tex-mml-svg.js');"
+"document.body.appendChild(newScript);";
without the subsequent calling instruction
MathJax.Hub.Queue(['Typeset',MathJax.Hub]);
The code is called this way:
webView.evaluateJavascript(js_command);
After some seconds the script works and the rendering is done, that is, the formulas appear as real math expressions (with right font, layout, and so on).

Close BarcodeScanner Ionic Native Plugin with timeout

this is my scenario: I have a barcodeScanner ionic plugin in my Ionic application, that is installed on a tablet where I cannot use hardware buttons.
My code:
this.barcodeScanner.scan(option).then((result) => {
console.dir(
"We got a barcode\n" +
"Result: " + result.text + "\n" +
"Format: " + result.format + "\n" +
"Cancelled: " + result.cancelled
);
this.product_code = result.text;
if(result.text !== "" && result.text !== null)
{
return this.searchByBarcode(result.text);
}
}, (err) => {
// An error occurred
});
Question
Is there a way to close the plugin after a certain amount of time if no barcode is scanned (or to insert a software button inside the plugin)?

Geolocation Javascript Cordova Not Triggered

I have a mobile app built with Cordova.
On one of the button an onclick event triggers a functions supposed to alert the geolocation. I've installed Cordova geolocation API for the project with cordova plugin add cordova-plugin-geolocation from https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-geolocation/#weather
Then I have the functions according to https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-geolocation/#reference
So basicaly my HTML is
<button onclick="getPOS();">CLICK_ME</button>
And my JS is
function getPOS(){
alert("ok");
var onSuccess = function(position) {
alert('Latitude: ' + position.coords.latitude + '\n' +
'Longitude: ' + position.coords.longitude + '\n' +
'Altitude: ' + position.coords.altitude + '\n' +
'Accuracy: ' + position.coords.accuracy + '\n' +
'Altitude Accuracy: ' + position.coords.altitudeAccuracy + '\n' +
'Heading: ' + position.coords.heading + '\n' +
'Speed: ' + position.coords.speed + '\n' +
'Timestamp: ' + position.timestamp + '\n');
};
// onError Callback receives a PositionError object
//
function onError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}
navigator.geolocation.getCurrentPosition(onSuccess, onError, { timeout: 30000 });
}
When I launch this in my firefox browser, it asks if I want to share location. If I choose to share, it shows the location fine.
Next When I build the app with cordova, when the apk installation is complete, it says the app requires Network connection and Location ..... which is normal and it means everything is properly set.
Then what I do is enable my phones GPS and Internet connextion
PROBLEM : upon clicking the link CLICK_ME on my phone, nothing happens though GPS and internet are enabled.
After the time out is expired, I get the following error :
Code: 3
message: Timeout expired
Any idea what's wrong here ?

Add these lines to manifest file
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"></uses-permission>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"></uses-permission>
It might be missing permissions for Android.
Regards.

Phantomjs does not open web page

I have started testing campus2020 site with casperjs (1.1.0-beta3) + phantomjs (1.9.8). And faced with the problem that site is not opening but instead tests just freeze. I have taken script example from phantomjs site:
var page = require('webpage').create();
page.open('http://informatik.uni-leipzig.de/campus2020', function(status) {
console.log("Status: " + status);
if(status === "success") {
page.render('example.png');
}
phantom.exit();
});
It worked fine on other sites. I have tested opening the campus2020 site with phantomjs on several environments: win 7, Ubuntu 14.04, with ghostdriver and java selenium webdriver, with phantomjs which is run in selenium grid on RHEL 6.6. All this options failed. I have tried to add userAgent option and setTimeout. Nothing changed. Also I tried to open this site using testing framework based on selenium webdriver which used phantomjs but it worked in the same way - phantomjs initialized and then freezes. Any ideas how could be this issue solved?
Update
Now my code looks like these:
var page = require('webpage').create();
console.log("Page is going to be opened...")
page.open('http://informatik.uni-leipzig.de/campus2020/', function(status) {
console.log("Status: " + status);
if(status === "success") {
page.render('example.png');
}
phantom.exit();
});
page.onConsoleMessage = function(msg, lineNum, sourceId) {
console.log('CONSOLE: ' + msg + ' (from line #' + lineNum + ' in "' + sourceId + '")');
};
page.onError = function (msg, trace) {
console.log(msg);
trace.forEach(function(item) {
console.log(' ', item.file, ':', item.line);
})
}
page.onResourceError = function(resourceError) {
console.log('Unable to load resource (#' + resourceError.id + 'URL:' + resourceError.url + ')');
console.log('Error code: ' + resourceError.errorCode + '. Description: ' + resourceError.errorString);
};
page.onResourceTimeout = function(request) {
console.log('Response (#' + request.id + '): ' + JSON.stringify(request));
};
And no errors are shown.

I don't know why there is this issue, but you can update to PhantomJS 2 and it will work. There are not yet binaries for Linux, so you will need to build it yourself.
You will also need to update your CasperJS version, because the 1.1-beta3 doesn't support PhantomJS 2, but the master branch on GitHub does.

phantomjs --debug=true phantom_test.js

How to call a Selenium command (ie. echo) within user extension?

When working on Selenium user-extension, how can you call a Selenium Command?
When debugging Selenium User Extension, how can you echo/console.log ?
Could find the answer on the internet so I'm posting my own answer below

To call a Selenium Command in user-extension.js, you need to use this syntax
this.doCommandName(param)
ie, to call echo
Selenium.prototype.doMyFunction = function(){
this.doEcho("This info will show on logs");
}

Perhaps this works even better. As now the debug messages of your user extension are similar as the debug and info messages of 'build-in' commands.
Selenium.prototype.doYourCommand = function(strTarget, strValue) {
LOG.debug("begin: doBaseURL | " + strTarget + " | " + strValue + " |");
LOG.info(strValue);
LOG.debug("end: doBaseURL | " + strTarget + " | " + strValue + " |");
}