fix: resolve ES modules compatibility in E2E test files
- Replace __dirname with import.meta.url pattern for ES modules compatibility - Add fileURLToPath imports to all E2E test files - Fix duplicate require statements in setup-verification.spec.ts - Update playwright.config.ts to use relative path instead of __dirname This fixes the 'ReferenceError: __dirname is not defined in ES module scope' error when running Playwright tests in the ES modules environment.
This commit is contained in:
Luca Sacchi Ricciardi
21
node_modules/aria-hidden/LICENSE
generated
vendored
Normal file
21
node_modules/aria-hidden/LICENSE
generated
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2017 Anton Korzunov
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
99
node_modules/aria-hidden/README.md
generated
vendored
Normal file
99
node_modules/aria-hidden/README.md
generated
vendored
Normal file
@@ -0,0 +1,99 @@
|
||||
# aria-hidden
|
||||
|
||||
[](https://nodei.co/npm/aria-hidden/)
|
||||
|
||||
Hides from ARIA everything, except provided node(s).
|
||||
|
||||
Helps to isolate modal dialogs and focused task - the content will be not accessible using
|
||||
accessible tools.
|
||||
|
||||
Now with [HTML inert](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert) support
|
||||
|
||||
# API
|
||||
|
||||
Just call `hideOthers` with DOM-node you want to keep, and it will _hide_ everything else.
|
||||
`targetNode` could be placed anywhere - its siblings would be hidden, but it and its parents - not.
|
||||
|
||||
> "hidden" in terms or `aria-hidden`
|
||||
|
||||
```js
|
||||
import { hideOthers } from 'aria-hidden';
|
||||
|
||||
const undo = hideOthers(exceptThisDOMnode);
|
||||
// everything else is "aria-hidden"
|
||||
|
||||
// undo changes
|
||||
undo();
|
||||
```
|
||||
|
||||
you also may limit the effect spread by providing top level node as a second parameter
|
||||
|
||||
```js
|
||||
// keep only `anotherNode` node visible in #app
|
||||
// the rest of document will be untouched
|
||||
hideOthers(anotherNode, document.getElementById('app'));
|
||||
```
|
||||
|
||||
> `parentNode` defaults to document.body
|
||||
|
||||
# Inert
|
||||
|
||||
While `aria-hidden` played important role in the past and will play in the future - the main
|
||||
use case always was around isolating content and making elements "transparent" not only for aria, but for
|
||||
user interaction as well.
|
||||
|
||||
This is why you might consider using `inertOthers`
|
||||
|
||||
```tsx
|
||||
import { hideOthers, inertOthers, supportsInert } from 'aria-hidden';
|
||||
|
||||
// focus on element mean "hide others". Ideally disable interactions
|
||||
const focusOnElement = (node) => (supportsInert() ? inertOthers(node) : hideOthers(node));
|
||||
```
|
||||
|
||||
the same function as above is already contructed and exported as
|
||||
|
||||
```tsx
|
||||
import { suppressOthers } from 'aria-hidden';
|
||||
|
||||
suppressOthers([keepThisNode, andThis]);
|
||||
```
|
||||
|
||||
⚠️ Note - inert **will disable any interactions** with _suppressed_ elements ⚠️
|
||||
|
||||
### Suppressing interactivity without inert
|
||||
|
||||
One can `marker`, the third argument to a function, to mark hidden elements.
|
||||
Later one can create a style matching given marker to apply `pointer-events:none`
|
||||
|
||||
```css
|
||||
[hidden-node] {
|
||||
pointer-events: none;
|
||||
}
|
||||
```
|
||||
|
||||
```tsx
|
||||
hideOthers(notThisOne, undefined /*parent = document*/, 'hidden-node');
|
||||
```
|
||||
|
||||
Generally speaking the same can be achieved by addressing `[aria-hidden]` nodes, but
|
||||
not all `aria-hidden` nodes are expected to be non-interactive.
|
||||
Hence, it's better to separate concerns.
|
||||
|
||||
# Inspiration
|
||||
|
||||
Based on [smooth-ui](https://github.com/smooth-code/smooth-ui) modal dialogs.
|
||||
|
||||
# See also
|
||||
|
||||
- [inert](https://github.com/WICG/inert) - The HTML attribute/property to mark parts of the DOM tree as "inert".
|
||||
- [react-focus-lock](https://github.com/theKashey/react-focus-lock) to lock Focus inside modal.
|
||||
- [react-scroll-lock](https://github.com/theKashey/react-scroll-lock) to disable page scroll while modal is opened.
|
||||
|
||||
# Size
|
||||
|
||||
Code is 30 lines long
|
||||
|
||||
# Licence
|
||||
|
||||
MIT
|
||||
71
node_modules/aria-hidden/package.json
generated
vendored
Normal file
71
node_modules/aria-hidden/package.json
generated
vendored
Normal file
@@ -0,0 +1,71 @@
|
||||
{
|
||||
"name": "aria-hidden",
|
||||
"version": "1.2.6",
|
||||
"description": "Cast aria-hidden to everything, except...",
|
||||
"main": "dist/es5/index.js",
|
||||
"sideEffects": false,
|
||||
"scripts": {
|
||||
"test": "jest",
|
||||
"dev": "lib-builder dev",
|
||||
"test:ci": "jest --runInBand --coverage",
|
||||
"build": "lib-builder build && yarn size:report",
|
||||
"prepublish": "yarn build",
|
||||
"release": "yarn build && yarn test",
|
||||
"lint": "lib-builder lint",
|
||||
"format": "lib-builder format",
|
||||
"size": "size-limit",
|
||||
"size:report": "size-limit --json > .size.json",
|
||||
"update": "lib-builder update",
|
||||
"prepublish-only": "yarn build && yarn changelog",
|
||||
"prepare": "husky install",
|
||||
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s",
|
||||
"changelog:rewrite": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
|
||||
},
|
||||
"author": "Anton Korzunov <thekashey@gmail.com>",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"@theuiteam/lib-builder": "^1.0.0",
|
||||
"@size-limit/preset-small-lib": "^11.1.6"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
},
|
||||
"jsnext:main": "dist/es2015/index.js",
|
||||
"module": "dist/es2015/index.js",
|
||||
"types": "dist/es5/index.d.ts",
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"keywords": [
|
||||
"DOM",
|
||||
"aria",
|
||||
"hidden",
|
||||
"inert"
|
||||
],
|
||||
"homepage": "https://github.com/theKashey/aria-hidden#readme",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/theKashey/aria-hidden.git"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": "^2.0.0"
|
||||
},
|
||||
"module:es2019": "dist/es2019/index.js",
|
||||
"lint-staged": {
|
||||
"*.{ts,tsx}": [
|
||||
"prettier --write",
|
||||
"eslint --fix"
|
||||
],
|
||||
"*.{js,css,json,md}": [
|
||||
"prettier --write"
|
||||
]
|
||||
},
|
||||
"prettier": {
|
||||
"printWidth": 120,
|
||||
"trailingComma": "es5",
|
||||
"tabWidth": 2,
|
||||
"semi": true,
|
||||
"singleQuote": true
|
||||
},
|
||||
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
|
||||
}
|
||||
Reference in New Issue
Block a user