[FOLIO-1035] Add chrome and FF to Nodejs build environment Created: 17/Jan/18 Updated: 12/Nov/18 Resolved: 03/May/18 |
|
| Status: | Closed |
| Project: | FOLIO |
| Components: | None |
| Affects versions: | None |
| Fix versions: | None |
| Type: | Task | Priority: | P2 |
| Reporter: | John Malconian | Assignee: | John Malconian |
| Resolution: | Done | Votes: | 0 |
| Labels: | ci, sprint31, sprint32, sprint33, sprint37 | ||
| Remaining Estimate: | Not Specified | ||
| Time Spent: | 2 days, 2 hours | ||
| Original estimate: | Not Specified | ||
| Sprint: |
| Description |
|
In order to support browser-based unit tests using karma, for example, add Chrome to Nodejs build environment in Docker. There is some good information here on how to set this up. It's a little tricky with Docker. https://hackernoon.com/running-karma-tests-with-headless-chrome-inside-docker-ae4aceb06ed3 |
| Comments |
| Comment by John Malconian [ 24/Apr/18 ] |
|
Steps to support karma with Chrome browser in FOLIO Jenkins build environment:
wget -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - && \
sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" \
>> /etc/apt/sources.list.d/google.list' && \
apt-get -q update && apt-get install -y google-chrome-stable
jenkins@c335a236ad0d:~/ui-eholdings$ yarn test --karma.singleRun --karma.browsers=ChromeHeadless
yarn run v1.5.1
$ stripes test karma demo/stripes.config.js --karma.singleRun --karma.browsers=ChromeHeadless
Starting Karma tests...
[2018-04-24 17:55:55.233] [DEBUG] config - No config file specified.
START:
webpack: wait until bundle finished:
webpack: Compiled successfully.
24 04 2018 17:56:45.876:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9876/
24 04 2018 17:56:45.877:INFO [launcher]: Launching browser ChromeHeadless with unlimited concurrency
24 04 2018 17:56:46.458:INFO [launcher]: Starting browser ChromeHeadless
24 04 2018 17:56:47.796:INFO [HeadlessChrome 66.0.3359 (Linux 0.0.0)]: Connected on socket RhNoMNw7F4FC-ZxdAAAA with id 50278796
Error retrieving backend
when trying to use the app
✔ informs user that an error has occurred
With no backend at all
when trying to use the app
✔ blocks access to the eholdings app and tells me that I need to install a backend
With unconfigured backend
when trying to use the app
✔ blocks access to the eholdings app and points you to the configuration screen
when visiting the KB auth form
✔ shows the form action buttons
filling in incomplete data
✔ displays an errored state for the blank customer id
✔ displays an errored state for the blank api key
filling in incomplete data, then filling in more data
✔ does not display an error state for customer id
✔ does not display an error state for api key
With valid backend configuration
when visiting the KB auth form
✔ has a field for the ebsco customer id
✔ has a field for the ebsco RM API key
✔ field for the ebsco RM API key appears with text as password hidden
✔ does not have visible form action buttons
filling in invalid data
✔ reports the error to the interface
filling in complete data
✔ shows the form actions
saving the changes
✖ disables the save button (skipped)
✖ indicates that it is working (skipped)
when the changes succeed
✔ hides the form actions
when saving the changes fail
✔ shows the form action buttons
✔ enables the save button
✔ shows an error message
when the validation fails
✔ does not enable the save button
then hitting the cancel button
✔ reverts the changes
...
Finished in 4 mins 22.871 secs / 21.691 secs @ 18:01:11 GMT+0000 (UTC)
SUMMARY:
✔ 810 tests completed
ℹ 18 tests skipped
Karma exited with 0
Done in 318.32s.
|
| Comment by John Malconian [ 24/Apr/18 ] |
|
With FF:
jenkins@c335a236ad0d:~/ui-eholdings$ yarn test --karma.singleRun --karma.browsers=FirefoxHeadless
yarn run v1.5.1
$ stripes test karma demo/stripes.config.js --karma.singleRun --karma.browsers=FirefoxHeadless
Starting Karma tests...
[2018-04-24 18:38:36.573] [DEBUG] config - No config file specified.
START:
webpack: wait until bundle finished:
webpack: Compiled successfully.
24 04 2018 18:39:14.157:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9876/
24 04 2018 18:39:14.158:INFO [launcher]: Launching browser FirefoxHeadless with unlimited concurrency
24 04 2018 18:39:14.162:INFO [launcher]: Starting browser FirefoxHeadless
24 04 2018 18:39:16.258:INFO [Firefox 59.0.0 (Ubuntu 0.0.0)]: Connected on socket vxuxis6_ZnBxIa41AAAA with id 62177346
Error retrieving backend
when trying to use the app
✔ informs user that an error has occurred
With no backend at all
when trying to use the app
✔ blocks access to the eholdings app and tells me that I need to install a backend
With unconfigured backend
when trying to use the app
✔ blocks access to the eholdings app and points you to the configuration screen
...
Finished in 7 mins 30.32 secs / 32.042 secs @ 18:46:48 GMT+0000 (UTC)
SUMMARY:
✔ 810 tests completed
ℹ 18 tests skipped
Karma exited with 0
Done in 494.01s.
sudo apt-get remove firefox The mozilla distribution seems less straight-forward. Even though I specify 'FirefoxHeadless' it doesn't want to run unless I start a virtual framebuffer and set my display: xvfb :10 & jenkins@c335a236ad0d:~/ui-eholdings$ yarn test --karma.singleRun --karma.browsers=FirefoxHeadless START: webpack: Compiled successfully. Anyway, it works. |
| Comment by John Malconian [ 26/Apr/18 ] |
|
The FF package that's included in the Ubuntu distro includes a headless option, but the Mozilla distro does not, therefore, a virtulal framebuffer (Xvfb) needs to be running and 'DISPLAY' needs to be set to run the latter. FOLIO Jenkins build environment will include FF from Ubuntu which is updated frequently to the latest version as well as FF ESR from the Mozilla - which is the "long-term support" version. Chrome "stable" will also be included, but in order to run properly in a docker container, a custom Chrome launcher must be defined in karma.conf.js: customLaunchers: {
chrome_docker: {
base: 'ChromeHeadless',
flags: [
'--no-sandbox',
'--disable-web-security'
]
}
|
| Comment by John Malconian [ 01/May/18 ] |
|
The FOLIO jenkins build image now includes Chrome, the latest version of Firefox for Ubuntu, as well as Firefox ESR. In order for Jenkins to run Chrome-based karma tests, a customLauncher Chrome browser needs to be added to the karma configuration. See customLaunchers configuration for Chrome in the previous comment above for example. If there is interest in pursuing this, I will implement a CI script that will run karma-based testing for UI-based repos as an opt-in per project configuration. |
| Comment by John Malconian [ 03/May/18 ] |
|
FOLIO Jenkins now supports Chrome and Firefox browser-based testing with Karma. See https://github.com/folio-org/stripes-components/pull/359 for example implementation. Steps needed:
|