Using conveyor in electronic

Question

I am trying to configure unit tests and e2e tests for an application that works with Electron for me using Protractor . I referenced a lot of different posts ( this one helped), but I still get an error message that I don't understand:

Message: Error while waiting for Protractor to sync with the page: "angular could not be found on the window" Stacktrace: undefined 

My conf.js file looks like this:

 exports.config = { directConnect : true, seleniumAddress: 'http://localhost:4444/wd/hub', baseUrl:"file://home/me/workspace/testing-project/main.js", capabilities: { browserName: "chrome", chromeOptions: { binary: "/home/me/.linuxbrew/lib/node_modules/electron-prebuilt/dist/electron", args: ["--test-type=webdriver"] } }, specs: ['todo-specs.js'], onPrepare: function(){ browser.resetUrl = "file://"; browser.driver.get("file://"); } }; 

Given the documentation provided on the Protractor website, I get the impression that I don't need to install anything (like Jasmine).
It surprises me that even if the path to main.js (which launches the application in accordance with the Electron specifications) is correct, I don’t see anything in the Electron window that appears.
Have any of you encountered this problem? Did you manage to solve the problem?

Answer 1

Apparently, using electronic binary code is not enough to run your application. However, after creating the binary for your application and linking it to the conf.js file, follow these steps:
I was able to reduce my file to this:
conf.js

 exports.config = { seleniumAddress: 'http://localhost:4444/wd/hub', specs: ['test-spec.js'], capabilities: { browserName: "chrome", chromeOptions: { binary: "./dist/myAwesomeApp/myAwesomeAppBinary" } }, onPrepare: function () { browser.resetUrl = "file://"; } }; 

Thus, there is no need to describe baseUrl or use browser.get() and browser.driver.get() to run the application in Electron.
However, I would prefer not to create a binary file of the application, but I do not think that this is possible now.

Answer 2

The transporter does not work well with Electron, as it does not have access to electron-specific APIs, and rendering cannot be properly controlled. Spectron , on the other hand, is specifically designed for Electron and has an API very similar to Protractor. This gives you the opportunity to simultaneously test both basic and rendering processes.

I had to copy some code from Protractor so that it waited for Angular 2 to load. (Pay no attention if you are not using Angular.) Here is a working example:

 const path = require('path'); const electron = require('electron-prebuilt'); var Application = require('spectron').Application var assert = require('assert') let appPath = path.join(__dirname, '..', 'dist'); function awaitAngular2(client) { client.timeoutsAsyncScript(5000); // From: https://github.com/angular/protractor/blob/master/lib/clientsidescripts.js // Returns a promise that resolves when all of Angular 2 components are loaded and stable return client.executeAsync(function(done) { try { var testabilities = window.getAllAngularTestabilities(); var count = testabilities.length; var decrement = function() { count--; if (count === 0) { done(); } }; testabilities.forEach(function(testability) { testability.whenStable(decrement); }); } catch (err) { done(err.message); } }); } describe('application launch', function () { this.timeout(10000) beforeEach(function () { this.app = new Application({ path: electron, args: [appPath] }); return this.app.start().then(() => { return awaitAngular2(this.app.client); }) }); afterEach(function () { if (this.app && this.app.isRunning()) { return this.app.stop() } }); it('shows an initial window', function () { return this.app.client.getWindowCount().then(function (count) { assert.equal(count, 1) }) }); it('shows a headline', function () { this.app.client.getText('app-banner h1').then(function (bannerText) { assert.equal(bannerText, 'Tour of Heroes'); }) }); }); 

If you have several .spec files that you want to run automatically, you can integrate them using Jasmine or Mocha Node.js.

Answer 3

Protractor is designed to work with angular applications, but you can also use it for non-angular applications.

If you use angular with your electronic application, then it will just look at ng-app and sync.

If you are not using the angular application, you must set isAngularSite(false) , then it will not try to synchronize.

Answer 4

Assuming you start the protractor from the root of your project, where main.js is located, you should set protractor.conf.js like this:

 exports.config = { directConnect: true, capabilities: { browserName: 'chrome', chromeOptions: { binary: 'node_modules/.bin/electron', args: ['app=main.js'] } }, onPrepare: function () { browser.resetUrl = "file://" } } 

Parameters capabilities.chromeOptions.args is what electron is passed to. For more documentation on capabilities , selenium has documentation on it here .