alphagov / accessible-autocomplete

An autocomplete component, built to be accessible.
https://alphagov.github.io/accessible-autocomplete/examples/
MIT License
915 stars 149 forks source link

Can't set up dev environment/fibers won't compile #608

Closed rgarner closed 11 months ago

rgarner commented 11 months ago

I'm on node v20.5.0, and wanting to contribute something (a debounce to avoid swamping a server), I've cloned the repo and attempted to npm install. @wdio/sync and/or webdriverio at the current version brings in fibers, which has a "NOTE OF OBSOLESCENCE" next to it. On my machine, Apple Silicon, the node_gyp that that brings in cannot compile. There's an early EBADENGINE warning against @wdio/sync which suggests this would only work between nodes 12 and 15.x. There are a bunch of deprecations too, but I'm ignoring those for now in an effort to get npm test and npm run build to work.

I'm primarily Ruby rather than JS, so apologies if I've missed something critical. I've checked the contributing guidelines and I think I'm good, but I'll happily take notes.

WARNING: large log ahead

npm WARN old lockfile
npm WARN old lockfile The package-lock.json file was created with an old version of npm,
npm WARN old lockfile so supplemental metadata must be fetched from the registry.
npm WARN old lockfile
npm WARN old lockfile This is a one-time fix-up, please be patient...
npm WARN old lockfile
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@wdio/sync@7.16.13',
npm WARN EBADENGINE   required: { node: '>=12.0.0 <16' },
npm WARN EBADENGINE   current: { node: 'v20.5.0', npm: '9.8.0' }
npm WARN EBADENGINE }
npm WARN deprecated @babel/plugin-proposal-json-strings@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-json-strings instead.
npm WARN deprecated @babel/plugin-proposal-optional-catch-binding@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-catch-binding instead.
npm WARN deprecated @babel/plugin-proposal-object-rest-spread@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-object-rest-spread instead.
npm WARN deprecated @babel/plugin-proposal-async-generator-functions@7.1.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-async-generator-functions instead.
npm WARN deprecated @babel/plugin-proposal-class-properties@7.1.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.
npm WARN deprecated source-map-url@0.4.0: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated circular-json@0.3.3: CircularJSON is in maintenance only, flatted is its successor.
npm WARN deprecated debug@3.2.6: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated fsevents@1.2.13: The v1 package contains DANGEROUS / INSECURE binaries. Upgrade to safe fsevents v2
npm WARN deprecated debug@4.1.1: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated babel-eslint@10.0.1: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.
npm WARN deprecated uuid@3.3.2: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated source-map-resolve@0.5.2: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated mkdirp@0.5.1: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)
npm WARN deprecated @npmcli/fs@1.1.0: this version had an improper engines field added, update to 1.1.1
npm WARN deprecated text-encoding@0.6.4: no longer maintained
npm WARN deprecated @babel/plugin-proposal-unicode-property-regex@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-unicode-property-regex instead.
npm WARN deprecated puppeteer@13.3.1: < 19.4.0 is no longer supported
npm WARN deprecated core-js@2.5.7: core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
npm ERR! code 127
npm ERR! path /Users/russ/dev/accessible-autocomplete/node_modules/fibers
npm ERR! command failed
npm ERR! command sh -c node build.js || nodejs build.js
npm ERR! CXX(target) Release/obj.target/fibers/src/fibers.o
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp info using node-gyp@9.4.0
npm ERR! gyp info using node@20.5.0 | darwin | arm64
npm ERR! gyp info find Python using Python version 3.11.3 found at "/opt/homebrew/opt/python@3.11/bin/python3.11"
npm ERR! gyp info spawn /opt/homebrew/opt/python@3.11/bin/python3.11
npm ERR! gyp info spawn args [
npm ERR! gyp info spawn args   '/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/gyp/gyp_main.py',
npm ERR! gyp info spawn args   'binding.gyp',
npm ERR! gyp info spawn args   '-f',
npm ERR! gyp info spawn args   'make',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/Users/russ/dev/accessible-autocomplete/node_modules/fibers/build/config.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/addon.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/Users/russ/Library/Caches/node-gyp/20.5.0/include/node/common.gypi',
npm ERR! gyp info spawn args   '-Dlibrary=shared_library',
npm ERR! gyp info spawn args   '-Dvisibility=default',
npm ERR! gyp info spawn args   '-Dnode_root_dir=/Users/russ/Library/Caches/node-gyp/20.5.0',
npm ERR! gyp info spawn args   '-Dnode_gyp_dir=/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp',
npm ERR! gyp info spawn args   '-Dnode_lib_file=/Users/russ/Library/Caches/node-gyp/20.5.0/<(target_arch)/node.lib',
npm ERR! gyp info spawn args   '-Dmodule_root_dir=/Users/russ/dev/accessible-autocomplete/node_modules/fibers',
npm ERR! gyp info spawn args   '-Dnode_engine=v8',
npm ERR! gyp info spawn args   '--depth=.',
npm ERR! gyp info spawn args   '--no-parallel',
npm ERR! gyp info spawn args   '--generator-output',
npm ERR! gyp info spawn args   'build',
npm ERR! gyp info spawn args   '-Goutput_dir=.'
npm ERR! gyp info spawn args ]
npm ERR! gyp info spawn make
npm ERR! gyp info spawn args [ 'BUILDTYPE=Release', '-C', 'build' ]
npm ERR! ../src/fibers.cc:27:65: error: no member named 'kFinalizer' in 'v8::WeakCallbackType'
npm ERR!                 handle.SetWeak(val, WeakCallbackShim<F, P>, WeakCallbackType::kFinalizer);
npm ERR!                                                             ~~~~~~~~~~~~~~~~~~^
npm ERR! 1 error generated.
npm ERR! make: *** [Release/obj.target/fibers/src/fibers.o] Error 1
npm ERR! gyp ERR! build error
npm ERR! gyp ERR! stack Error: `make` failed with exit code: 2
npm ERR! gyp ERR! stack     at ChildProcess.onExit (/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:203:23)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:514:28)
npm ERR! gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:294:12)
npm ERR! gyp ERR! System Darwin 21.6.0
npm ERR! gyp ERR! command "/opt/homebrew/Cellar/node/20.5.0/bin/node" "/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--release"
npm ERR! gyp ERR! cwd /Users/russ/dev/accessible-autocomplete/node_modules/fibers
npm ERR! gyp ERR! node -v v20.5.0
npm ERR! gyp ERR! node-gyp -v v9.4.0
npm ERR! gyp ERR! not ok
npm ERR! node-gyp exited with code: 1
npm ERR! Please make sure you are using a supported platform and node version. If you
npm ERR! would like to compile fibers on this machine please make sure you have setup your
npm ERR! build environment--
npm ERR! Windows + OS X instructions here: https://github.com/nodejs/node-gyp
npm ERR! Ubuntu users please run: `sudo apt-get install g++ build-essential`
npm ERR! RHEL users please run: `yum install gcc-c++` and `yum groupinstall 'Development Tools'`
npm ERR! Alpine users please run: `sudo apk add python make g++`
npm ERR! sh: nodejs: command not found

npm ERR! A complete log of this run can be found in: /Users/russ/.npm/_logs/2023-11-17T09_08_42_283Z-debug-0.log
colinrotherham commented 11 months ago

Hi @rgarner

I've had a quick go with the following combination:

Regarding the errors, it looks like there were breaking changes in Python v3.11+ but v3.10 worked

rgarner commented 11 months ago

@colinrotherham thanks! I installed pyenv, then pyenv install 3.10, which installed 3.10.13 and after pyenv local 3.10.13, tried again (I've also tried with 3.10.1), but I get the same npm ERR! ../src/fibers.cc:27:65: error: no member named 'kFinalizer' in 'v8::WeakCallbackType':

➜  accessible-autocomplete git:(main) ✗ npm install
npm WARN old lockfile
npm WARN old lockfile The package-lock.json file was created with an old version of npm,
npm WARN old lockfile so supplemental metadata must be fetched from the registry.
npm WARN old lockfile
npm WARN old lockfile This is a one-time fix-up, please be patient...
npm WARN old lockfile
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@wdio/sync@7.16.13',
npm WARN EBADENGINE   required: { node: '>=12.0.0 <16' },
npm WARN EBADENGINE   current: { node: 'v20.5.0', npm: '9.8.0' }
npm WARN EBADENGINE }
npm WARN deprecated @babel/plugin-proposal-json-strings@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-json-strings instead.
npm WARN deprecated @babel/plugin-proposal-optional-catch-binding@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-catch-binding instead.
npm WARN deprecated @babel/plugin-proposal-async-generator-functions@7.1.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-async-generator-functions instead.
npm WARN deprecated @babel/plugin-proposal-object-rest-spread@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-object-rest-spread instead.
npm WARN deprecated @babel/plugin-proposal-class-properties@7.1.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.
npm WARN deprecated source-map-url@0.4.0: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated circular-json@0.3.3: CircularJSON is in maintenance only, flatted is its successor.
npm WARN deprecated debug@3.2.6: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated fsevents@1.2.13: The v1 package contains DANGEROUS / INSECURE binaries. Upgrade to safe fsevents v2
npm WARN deprecated debug@4.1.1: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated babel-eslint@10.0.1: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.
npm WARN deprecated uuid@3.3.2: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated source-map-resolve@0.5.2: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated mkdirp@0.5.1: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)
npm WARN deprecated @npmcli/fs@1.1.0: this version had an improper engines field added, update to 1.1.1
npm WARN deprecated text-encoding@0.6.4: no longer maintained
npm WARN deprecated @babel/plugin-proposal-unicode-property-regex@7.0.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-unicode-property-regex instead.
npm WARN deprecated puppeteer@13.3.1: < 19.4.0 is no longer supported
npm WARN deprecated core-js@2.5.7: core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
npm ERR! code 127
npm ERR! path /Users/russ/dev/accessible-autocomplete/node_modules/fibers
npm ERR! command failed
npm ERR! command sh -c node build.js || nodejs build.js
npm ERR! CXX(target) Release/obj.target/fibers/src/fibers.o
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp info using node-gyp@9.4.0
npm ERR! gyp info using node@20.5.0 | darwin | arm64
npm ERR! gyp info find Python using Python version 3.10.13 found at "/Users/russ/.pyenv/versions/3.10.13/bin/python3"
npm ERR! gyp info spawn /Users/russ/.pyenv/versions/3.10.13/bin/python3
npm ERR! gyp info spawn args [
npm ERR! gyp info spawn args   '/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/gyp/gyp_main.py',
npm ERR! gyp info spawn args   'binding.gyp',
npm ERR! gyp info spawn args   '-f',
npm ERR! gyp info spawn args   'make',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/Users/russ/dev/accessible-autocomplete/node_modules/fibers/build/config.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/addon.gypi',
npm ERR! gyp info spawn args   '-I',
npm ERR! gyp info spawn args   '/Users/russ/Library/Caches/node-gyp/20.5.0/include/node/common.gypi',
npm ERR! gyp info spawn args   '-Dlibrary=shared_library',
npm ERR! gyp info spawn args   '-Dvisibility=default',
npm ERR! gyp info spawn args   '-Dnode_root_dir=/Users/russ/Library/Caches/node-gyp/20.5.0',
npm ERR! gyp info spawn args   '-Dnode_gyp_dir=/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp',
npm ERR! gyp info spawn args   '-Dnode_lib_file=/Users/russ/Library/Caches/node-gyp/20.5.0/<(target_arch)/node.lib',
npm ERR! gyp info spawn args   '-Dmodule_root_dir=/Users/russ/dev/accessible-autocomplete/node_modules/fibers',
npm ERR! gyp info spawn args   '-Dnode_engine=v8',
npm ERR! gyp info spawn args   '--depth=.',
npm ERR! gyp info spawn args   '--no-parallel',
npm ERR! gyp info spawn args   '--generator-output',
npm ERR! gyp info spawn args   'build',
npm ERR! gyp info spawn args   '-Goutput_dir=.'
npm ERR! gyp info spawn args ]
npm ERR! gyp info spawn make
npm ERR! gyp info spawn args [ 'BUILDTYPE=Release', '-C', 'build' ]
npm ERR! ../src/fibers.cc:27:65: error: no member named 'kFinalizer' in 'v8::WeakCallbackType'
npm ERR!                 handle.SetWeak(val, WeakCallbackShim<F, P>, WeakCallbackType::kFinalizer);
npm ERR!                                                             ~~~~~~~~~~~~~~~~~~^
npm ERR! 1 error generated.
npm ERR! make: *** [Release/obj.target/fibers/src/fibers.o] Error 1
npm ERR! gyp ERR! build error
npm ERR! gyp ERR! stack Error: `make` failed with exit code: 2
npm ERR! gyp ERR! stack     at ChildProcess.onExit (/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:203:23)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:514:28)
npm ERR! gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:294:12)
npm ERR! gyp ERR! System Darwin 21.6.0
npm ERR! gyp ERR! command "/opt/homebrew/Cellar/node/20.5.0/bin/node" "/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--release"
npm ERR! gyp ERR! cwd /Users/russ/dev/accessible-autocomplete/node_modules/fibers
npm ERR! gyp ERR! node -v v20.5.0
npm ERR! gyp ERR! node-gyp -v v9.4.0
npm ERR! gyp ERR! not ok
npm ERR! node-gyp exited with code: 1
npm ERR! Please make sure you are using a supported platform and node version. If you
npm ERR! would like to compile fibers on this machine please make sure you have setup your
npm ERR! build environment--
npm ERR! Windows + OS X instructions here: https://github.com/nodejs/node-gyp
npm ERR! Ubuntu users please run: `sudo apt-get install g++ build-essential`
npm ERR! RHEL users please run: `yum install gcc-c++` and `yum groupinstall 'Development Tools'`
npm ERR! Alpine users please run: `sudo apk add python make g++`
npm ERR! sh: nodejs: command not found

npm ERR! A complete log of this run can be found in: /Users/russ/.npm/_logs/2023-11-17T10_45_49_459Z-debug-0.log
colinrotherham commented 11 months ago

Ah sorry @rgarner are you able to run Node.js 14 on Apple Silicon?

This line tells me you're on a Node.js 20 release:

npm WARN EBADENGINE   current: { node: 'v20.5.0', npm: '9.8.0' }
rgarner commented 11 months ago

Ah sorry @rgarner are you able to run Node.js 14 on Apple Silicon?

This line tells me you're on a Node.js 20 release:

I'll get nvm and try again! (it's compiling but it is a several MB wall of deprecations so far)

If it's the case that these versions are required to be in alignment for contribution, would it help to have a .python_version and a .nvmrc for development at the root?

EDIT: ah, you have one for Node! I just didn't know where I was looking...

rgarner commented 11 months ago

@colinrotherham that's got it, thanks! npm test just finished running.

colinrotherham commented 11 months ago

Thanks @rgarner that's great

Good point regarding Python, was new to me today that v3.11 broke node-gyp in Node.js v16's npm!

I'll see if we can add an update with this project under maintenance

rgarner commented 11 months ago

For the purposes of context, I'm going to leave the log you get when you use the right node (14.x) with the wrong version (>=3.11) of Python, before adding a .python_version in a PR:

ValueError: invalid mode: 'rU' while trying to load binding.gyp
gyp ERR! configure error
gyp ERR! stack Error: `gyp` failed with exit code: 1
gyp ERR! stack     at ChildProcess.onCpExit (/Users/russ/.nvm/versions/node/v14.21.3/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:351:16)
gyp ERR! stack     at ChildProcess.emit (events.js:400:28)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:285:12)
gyp ERR! System Darwin 21.6.0
gyp ERR! command "/Users/russ/.nvm/versions/node/v14.21.3/bin/node" "/Users/russ/.nvm/versions/node/v14.21.3/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--release"
gyp ERR! cwd /Users/russ/dev/accessible-autocomplete/node_modules/fibers
gyp ERR! node -v v14.21.3
gyp ERR! node-gyp -v v5.1.1
gyp ERR! not ok
colinrotherham commented 11 months ago

I've avoided this issue by removing @wdio/sync in https://github.com/alphagov/accessible-autocomplete/pull/612/commits/eb5318c13befcd69a9913b9310b3ab6ddbb3259d as part of: