mediawiki-skins-MinervaNeue/tests/selenium
jdlrobson e888b487f4 Merge skins.minerva.talk and skins.minerva.watchstar into skins.minerva.script
Logic is moved from server to client. Config is added via getSkinConfigVariables (e.g.
passed to mw.config ) and a JavaScript if statement.

The IIFE in watchstar and talk files is replaced with a module.exports function to avoid
refactoring at this point and added risk. The file contents remain the same.

skins.minerva.options is left as is, given the code is more experimental and used in
the beta mode - should not be sent to all clients.

Additional change:
* Remove skins.minerva.toggling (that module has been empty for a week now and functionality
moved to mobile.init module)

Depends-On: Ie71adbe18e8dbeb661ddb9d7d3d1d0897891d515
Bug: T233048
Change-Id: Ife777e76d9d77894fb5d09e7c8f0238b00596a7a
2019-09-24 14:19:18 -06:00
..
config Adding "diff.feature" selenium test 2019-04-10 23:15:37 +00:00
features Merge skins.minerva.talk and skins.minerva.watchstar into skins.minerva.script 2019-09-24 14:19:18 -06:00
specs build: Update linters 2019-09-17 14:21:30 +01:00
.eslintrc.json build: Update linters 2019-09-17 14:21:30 +01:00
README.md QA: Port Notifications browser test to Node.js 2019-04-11 13:26:39 -07:00
wdio.conf.cucumber.js Adding initial webdriver.io test 2019-04-08 16:05:22 -07:00
wdio.conf.js build: Update linters 2019-09-17 14:21:30 +01:00

Selenium tests

Please see tests/selenium/README.md file in mediawiki/core repository, usually at mediawiki/vagrant/mediawiki folder.

Setup

Set up MediaWiki-Vagrant:

cd mediawiki/vagrant
vagrant up
vagrant roles enable minerva
vagrant provision
cd mediawiki
npm install

Start Chromedriver and run all tests

Run both mediawiki/core and extension tests from mediawiki/core repository (usually at mediawiki/vagrant/mediawiki folder):

npm run selenium

Start Chromedriver

To run only some tests, you first have to start Chromedriver in one terminal tab (or window):

chromedriver --url-base=wd/hub --port=4444

Run test(s) from one file

Then, in another terminal tab (or window) run this from mediawiki/core repository (usually at mediawiki/vagrant/mediawiki folder):

npm run selenium-test -- --spec tests/selenium/specs/FILE-NAME.js

wdio is a dependency of mediawiki/core that you have installed with npm install.

Run specific test(s)

To run only test(s) which name contains string TEST-NAME, run this from mediawiki/core repository (usually at mediawiki/vagrant/mediawiki folder):

./node_modules/.bin/wdio tests/selenium/wdio.conf.js --spec extensions/EXTENSION-NAME/tests/selenium/specs/FILE-NAME.js --mochaOpts.grep TEST-NAME

Make sure Chromedriver is running when executing the above command.

Migrating a test from Ruby to Node.js

Currently we are in the midst of porting our Ruby tests to Node.js. When the tests/browser/features folder is empty, we are done and the whole tests/browser folder can be removed.

This is a slow process (porting a single test can take an entire afternoon).

Step 1 - move feature file

Move the feature you want to port to Node.js

mv tests/browser/features/<name>.feature tests/selenium/features/

Example: https://gerrit.wikimedia.org/r/#/c/mediawiki/skins/MinervaNeue/+/501792/1/tests/selenium/features/editor_wikitext_saving.feature

Step 2 - add boilerplate for missing steps

Run the feature in cucumber

npm run selenium-test-cucumber -- --spec tests/selenium/features/<name>.feature

You will get warnings such as:

Step "I go to a page that has languages" is not defined. You can ignore this error by setting cucumberOpts.ignoreUndefinedDefinitions as true.

For each missing step define them as one liners inside selenium/features/step_definitions/index.js

Create functions with empty bodies for each step.

Function anmes should be camel case without space, for example, I go to a page that has languages becomes iGoToAPageThatHasLanguages. Each function should be imported from a step file inside the features/step_definitions folder.

Re-reun the test. If done correctly this should now pass.

Example: https://gerrit.wikimedia.org/r/#/c/mediawiki/skins/MinervaNeue/+/501792/1..2

Step 3 - copy across Ruby function bodies

Copy across the body of the Ruby equivalent inside each function body in tests/browser/features/step_definitions as comments.

Example: https://gerrit.wikimedia.org/r/#/c/mediawiki/skins/MinervaNeue/+/501792/2..3

Step 4 - rewrite Ruby to Node.js

Sadly there is no shortcut here. Reuse as much as you can. Work with the knowledge that the parts you are adding will aid the next browser test migration.

The docs are your friend: http://v4.webdriver.io/api/utility/waitForVisible.html

Example: https://gerrit.wikimedia.org/r/#/c/mediawiki/skins/MinervaNeue/+/501792/2..4

Step 5 - Make it work without Cucumber

Now the tests should be passing when run the browser tests using wdio.conf.cucumber.js or npm run selenium-test-cucumber

The final step involves making these run with npm run selenium-test

This is relatively straightforward and mechanical.

  1. Copy the feature file to the specs folder
cp tests/selenium/features/editor_wikitext_saving.feature tests/selenium/specs/editor_wikitext_saving.js
  1. Convert indents to tabs
  2. Add // before any tags
  3. Replace Scenario: <name> with it( '<name>', () => {
  4. Add closing braces for all scenarios: } );
  5. Replace Feature: <feature> with describe('<feature>)', () => { and add closing brace.
  6. Replace Background: with beforeEach( () => { and add closing brace.
  7. Find and replace Given , When , And , Then with empy strings.
  8. At top of file copy and paste imports from selenium/features/step_definitions/index.js to top of your new file and rewrite their paths.
  9. Relying on autocomplete (VisualStudio Code works great) replace all the lines with the imports
  10. Drop unused imports from the file.