Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Question about integrating wdio-image-comparison-service #9

Closed
kumarpatel opened this issue Jul 10, 2019 · 8 comments
Closed

Question about integrating wdio-image-comparison-service #9

kumarpatel opened this issue Jul 10, 2019 · 8 comments

Comments

@kumarpatel
Copy link

Followed your advise on building my own image. #6 (comment)

I tried to integrate wdio-image-comparison-service in my image by following their integrating guide. https://webdriver.io/blog/2019/05/18/visual-regression-for-v5.html

Seems to be failing at

npm install -g wdio-image-comparison-service

Just wondering if you have any insight into what might be wrong and how to fix it.
It looks like a mkdir permission issue to create a dir in /usr/lib/node_modules/

Any ideas on how to fix this? (any help would be appreciated)

Step 5/11 : RUN npm install -g wdio-image-comparison-service
 ---> Running in 8e26e11af505

> [email protected] install /usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas
> node-pre-gyp install --fallback-to-build

node-pre-gyp WARN Using needle for node-pre-gyp https download
node-pre-gyp WARN Pre-built binaries not installable for [email protected] and [email protected] (node-v64 ABI, musl) (falling back to source compile with node-gyp)
node-pre-gyp WARN Hit error EACCES: permission denied, mkdir '/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build'
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at PythonFinder.failNoPython (/usr/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:484:19)
gyp ERR! stack     at PythonFinder.<anonymous> (/usr/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:406:16)
gyp ERR! stack     at F (/usr/lib/node_modules/npm/node_modules/which/which.js:68:16)
gyp ERR! stack     at E (/usr/lib/node_modules/npm/node_modules/which/which.js:80:29)
gyp ERR! stack     at /usr/lib/node_modules/npm/node_modules/which/which.js:89:16
gyp ERR! stack     at /usr/lib/node_modules/npm/node_modules/isexe/index.js:42:5
gyp ERR! stack     at /usr/lib/node_modules/npm/node_modules/isexe/mode.js:8:5
gyp ERR! stack     at FSReqWrap.oncomplete (fs.js:153:21)
gyp ERR! System Linux 4.9.125-linuxkit
gyp ERR! command "/usr/bin/node" "/usr/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--module=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release/canvas.node" "--module_name=canvas" "--module_path=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release" "--napi_version=4" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v64"
gyp ERR! cwd /usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas
gyp ERR! node -v v10.16.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute '/usr/bin/node /usr/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --module=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release --napi_version=4 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v64' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (/usr/lib/node_modules/wdio-image-comparison-service/node_modules/node-pre-gyp/lib/util/compile.js:83:29)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:198:13)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:982:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)
node-pre-gyp ERR! System Linux 4.9.125-linuxkit
node-pre-gyp ERR! command "/usr/bin/node" "/usr/lib/node_modules/wdio-image-comparison-service/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build"
node-pre-gyp ERR! cwd /usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas
node-pre-gyp ERR! node -v v10.16.0
node-pre-gyp ERR! node-pre-gyp -v v0.11.0
node-pre-gyp ERR! not ok
Failed to execute '/usr/bin/node /usr/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --module=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release --napi_version=4 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v64' (1)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: `node-pre-gyp install --fallback-to-build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2019-07-10T19_50_11_908Z-debug.log
The command '/bin/sh -c npm install -g wdio-image-comparison-service' returned a non-zero code: 1
yamafaktory pushed a commit to allthings-archive/wdio that referenced this issue Jul 11, 2019
@DmitryMarkov
Merge pull request blueimp#9 from allthings/feat/waitForDisplayedAndC…
5432f7d 
…lick

feat: add waitForDisplayedAndClick command
@blueimp
Copy link
Owner

blueimp commented Jul 11, 2019

Hi @kumarpatel,
to install global packages with NPM, you will need root permissions. To do so, wrap your RUN command the following way:

USER root
RUN npm install -g wdio-image-comparison-service
USER wdio

@kumarpatel
Copy link
Author

Did that. Got error re. missing python in this stage.

> [email protected] install /usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas

So added missing python dependencies. (and few other to be sure)
and here's the new error output. Still seems to be permission issues.

node-pre-gyp WARN Using needle for node-pre-gyp https download
node-pre-gyp WARN Pre-built binaries not installable for [email protected] and [email protected] (node-v64 ABI, musl) (falling back to source compile with node-gyp)
node-pre-gyp WARN Hit error EACCES: permission denied, mkdir '/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build'
gyp WARN EACCES user "undefined" does not have permission to access the dev dir "/root/.node-gyp/10.16.0"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/.node-gyp"
gyp WARN install got an error, rolling back install
gyp WARN install got an error, rolling back install
gyp ERR! configure error
gyp ERR! stack Error: EACCES: permission denied, mkdir '/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/.node-gyp'
gyp ERR! System Linux 4.9.125-linuxkit
gyp ERR! command "/usr/bin/node" "/usr/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--module=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release/canvas.node" "--module_name=canvas" "--module_path=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release" "--napi_version=4" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v64"
gyp ERR! cwd /usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas
gyp ERR! node -v v10.16.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute '/usr/bin/node /usr/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --module=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas/build/Release --napi_version=4 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v64' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (/usr/lib/node_modules/wdio-image-comparison-service/node_modules/node-pre-gyp/lib/util/compile.js:83:29)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:198:13)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:982:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)
node-pre-gyp ERR! System Linux 4.9.125-linuxkit
node-pre-gyp ERR! command "/usr/bin/node" "/usr/lib/node_modules/wdio-image-comparison-service/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build"
node-pre-gyp ERR! cwd /usr/lib/node_modules/wdio-image-comparison-service/node_modules/canvas
node-pre-gyp ERR! node -v v10.16.0
node-pre-gyp ERR! node-pre-gyp -v v0.11.0
node-pre-gyp ERR! not ok

@kumarpatel kumarpatel mentioned this issue Jul 11, 2019
Closed
@kumarpatel
Copy link
Author

Also tried installing node_modules locally by removing read_only: true and changing the host mount to .:/opt

Then,
docker-compose run --rm --entrypoint npm wdio install -g wdio-image-comparison-service

Errors out with


npm WARN checkPermissions Missing write access to /usr/lib/node_modules
npm ERR! path /usr/lib/node_modules
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall access
npm ERR! Error: EACCES: permission denied, access '/usr/lib/node_modules'
npm ERR!  { [Error: EACCES: permission denied, access '/usr/lib/node_modules']
npm ERR!   stack:
npm ERR!    'Error: EACCES: permission denied, access \'/usr/lib/node_modules\'',
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   syscall: 'access',
npm ERR!   path: '/usr/lib/node_modules' }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator (though this is not recommended).

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/wdio/.npm/_logs/2019-07-11T21_37_37_073Z-debug.log

@blueimp
Copy link
Owner

blueimp commented Jul 14, 2019

The image is set up for read-only mode on purpose.
Installation is done as root user, while execution is done as wdio user.
You have to make sure that any installation step is done as root.

I've also just updated the Dockerfile and changed the method of how NPM packages are installed, now it's using a package.json (and package-lock.json) file.
You might wanna fork the Dockerfile and simply use a custom package.json config.

By the way, this project already includes a method for image comparisons, please see the documentation here:
https://github.com/blueimp/wdio-screen-commands#usage

@kumarpatel
Copy link
Author

awesome. Thanks. I'll give that shot in a moment.
I was looking into wdio-image-comparison-service due to it's ability to take full page screenshots.
That being said, I think it simply scrolls through the page taking screenshots and stitches them together.

@blueimp
Copy link
Owner

blueimp commented Jul 20, 2019

@kumarpatel can we close this issue or do you require further support?

@kumarpatel
Copy link
Author

close it. Looks like the issue is with wdio-image-comparison-service.
Not with this project.

@blueimp
Copy link
Owner

blueimp commented Jul 20, 2019

Thank you! ☺️

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@blueimp @kumarpatel