accented 0.0.1-dev.4 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +214 -0
- package/dist/accented.d.ts +28 -7
- package/dist/accented.d.ts.map +1 -1
- package/dist/accented.js +100 -42
- package/dist/accented.js.map +1 -1
- package/dist/constants.d.ts +3 -0
- package/dist/constants.d.ts.map +1 -0
- package/dist/constants.js +3 -0
- package/dist/constants.js.map +1 -0
- package/dist/dom-updater.d.ts +1 -6
- package/dist/dom-updater.d.ts.map +1 -1
- package/dist/dom-updater.js +94 -20
- package/dist/dom-updater.js.map +1 -1
- package/dist/elements/accented-dialog.d.ts +356 -0
- package/dist/elements/accented-dialog.d.ts.map +1 -0
- package/dist/elements/accented-dialog.js +361 -0
- package/dist/elements/accented-dialog.js.map +1 -0
- package/dist/elements/accented-trigger.d.ts +359 -0
- package/dist/elements/accented-trigger.d.ts.map +1 -0
- package/dist/elements/accented-trigger.js +159 -0
- package/dist/elements/accented-trigger.js.map +1 -0
- package/dist/intersection-observer.d.ts +5 -0
- package/dist/intersection-observer.d.ts.map +1 -0
- package/dist/intersection-observer.js +28 -0
- package/dist/intersection-observer.js.map +1 -0
- package/dist/log-and-rethrow.d.ts +2 -0
- package/dist/log-and-rethrow.d.ts.map +1 -0
- package/dist/log-and-rethrow.js +7 -0
- package/dist/log-and-rethrow.js.map +1 -0
- package/dist/logger.d.ts +2 -0
- package/dist/logger.d.ts.map +1 -0
- package/dist/logger.js +25 -0
- package/dist/logger.js.map +1 -0
- package/dist/register-elements.d.ts +2 -0
- package/dist/register-elements.d.ts.map +1 -0
- package/dist/register-elements.js +21 -0
- package/dist/register-elements.js.map +1 -0
- package/dist/resize-listener.d.ts +2 -0
- package/dist/resize-listener.d.ts.map +1 -0
- package/dist/resize-listener.js +18 -0
- package/dist/resize-listener.js.map +1 -0
- package/dist/scanner.d.ts +3 -0
- package/dist/scanner.d.ts.map +1 -0
- package/dist/scanner.js +120 -0
- package/dist/scanner.js.map +1 -0
- package/dist/scroll-listeners.d.ts +2 -0
- package/dist/scroll-listeners.d.ts.map +1 -0
- package/dist/scroll-listeners.js +38 -0
- package/dist/scroll-listeners.js.map +1 -0
- package/dist/state.d.ts +6 -0
- package/dist/state.d.ts.map +1 -0
- package/dist/state.js +14 -0
- package/dist/state.js.map +1 -0
- package/dist/task-queue.d.ts +3 -4
- package/dist/task-queue.d.ts.map +1 -1
- package/dist/task-queue.js +27 -23
- package/dist/task-queue.js.map +1 -1
- package/dist/types.d.ts +136 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -0
- package/dist/utils/are-issue-sets-equal.d.ts +3 -0
- package/dist/utils/are-issue-sets-equal.d.ts.map +1 -0
- package/dist/utils/are-issue-sets-equal.js +6 -0
- package/dist/utils/are-issue-sets-equal.js.map +1 -0
- package/dist/utils/deep-merge.d.ts +4 -0
- package/dist/utils/deep-merge.d.ts.map +1 -0
- package/dist/utils/deep-merge.js +18 -0
- package/dist/utils/deep-merge.js.map +1 -0
- package/dist/utils/get-element-html.d.ts +2 -0
- package/dist/utils/get-element-html.d.ts.map +1 -0
- package/dist/utils/get-element-html.js +14 -0
- package/dist/utils/get-element-html.js.map +1 -0
- package/dist/utils/get-element-position.d.ts +3 -0
- package/dist/utils/get-element-position.d.ts.map +1 -0
- package/dist/utils/get-element-position.js +22 -0
- package/dist/utils/get-element-position.js.map +1 -0
- package/dist/utils/get-scrollable-ancestors.d.ts +2 -0
- package/dist/utils/get-scrollable-ancestors.d.ts.map +1 -0
- package/dist/utils/get-scrollable-ancestors.js +15 -0
- package/dist/utils/get-scrollable-ancestors.js.map +1 -0
- package/dist/utils/recalculate-positions.d.ts +2 -0
- package/dist/utils/recalculate-positions.d.ts.map +1 -0
- package/dist/utils/recalculate-positions.js +27 -0
- package/dist/utils/recalculate-positions.js.map +1 -0
- package/dist/utils/recalculate-scrollable-ancestors.d.ts +2 -0
- package/dist/utils/recalculate-scrollable-ancestors.d.ts.map +1 -0
- package/dist/utils/recalculate-scrollable-ancestors.js +13 -0
- package/dist/utils/recalculate-scrollable-ancestors.js.map +1 -0
- package/dist/utils/supports-anchor-positioning.d.ts +6 -0
- package/dist/utils/supports-anchor-positioning.d.ts.map +1 -0
- package/dist/utils/supports-anchor-positioning.js +4 -0
- package/dist/utils/supports-anchor-positioning.js.map +1 -0
- package/dist/utils/transform-violations.d.ts +4 -0
- package/dist/utils/transform-violations.d.ts.map +1 -0
- package/dist/utils/transform-violations.js +48 -0
- package/dist/utils/transform-violations.js.map +1 -0
- package/dist/utils/update-elements-with-issues.d.ts +7 -0
- package/dist/utils/update-elements-with-issues.d.ts.map +1 -0
- package/dist/utils/update-elements-with-issues.js +64 -0
- package/dist/utils/update-elements-with-issues.js.map +1 -0
- package/dist/validate-options.d.ts +3 -0
- package/dist/validate-options.d.ts.map +1 -0
- package/dist/validate-options.js +42 -0
- package/dist/validate-options.js.map +1 -0
- package/package.json +9 -4
- package/src/accented.test.ts +24 -0
- package/src/accented.ts +119 -0
- package/src/constants.ts +2 -0
- package/src/dom-updater.ts +112 -0
- package/src/elements/accented-dialog.ts +384 -0
- package/src/elements/accented-trigger.ts +179 -0
- package/src/intersection-observer.ts +28 -0
- package/src/log-and-rethrow.ts +9 -0
- package/src/logger.ts +26 -0
- package/src/register-elements.ts +21 -0
- package/src/resize-listener.ts +17 -0
- package/src/scanner.ts +139 -0
- package/src/scroll-listeners.ts +37 -0
- package/src/state.ts +24 -0
- package/src/task-queue.test.ts +135 -0
- package/src/task-queue.ts +59 -0
- package/src/types.ts +155 -0
- package/src/utils/are-issue-sets-equal.test.ts +49 -0
- package/src/utils/are-issue-sets-equal.ts +10 -0
- package/src/utils/deep-merge.test.ts +34 -0
- package/src/utils/deep-merge.ts +18 -0
- package/src/utils/get-element-html.ts +13 -0
- package/src/utils/get-element-position.ts +21 -0
- package/src/utils/get-scrollable-ancestors.ts +14 -0
- package/src/utils/recalculate-positions.ts +27 -0
- package/src/utils/recalculate-scrollable-ancestors.ts +13 -0
- package/src/utils/supports-anchor-positioning.ts +7 -0
- package/src/utils/transform-violations.test.ts +124 -0
- package/src/utils/transform-violations.ts +56 -0
- package/src/utils/update-elements-with-issues.test.ts +283 -0
- package/src/utils/update-elements-with-issues.ts +75 -0
- package/src/validate-options.ts +44 -0
- package/dist/utils/issuesToElements.d.ts +0 -3
- package/dist/utils/issuesToElements.d.ts.map +0 -1
- package/dist/utils/issuesToElements.js +0 -16
- package/dist/utils/issuesToElements.js.map +0 -1
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import getAccentedTrigger from './elements/accented-trigger.js';
|
|
2
|
+
import getAccentedDialog from './elements/accented-dialog.js';
|
|
3
|
+
export default function registerElements(name) {
|
|
4
|
+
const elements = [
|
|
5
|
+
{
|
|
6
|
+
elementName: `${name}-trigger`,
|
|
7
|
+
Component: getAccentedTrigger(name)
|
|
8
|
+
},
|
|
9
|
+
{
|
|
10
|
+
elementName: `${name}-dialog`,
|
|
11
|
+
Component: getAccentedDialog()
|
|
12
|
+
}
|
|
13
|
+
];
|
|
14
|
+
for (const { elementName, Component } of elements) {
|
|
15
|
+
if (!customElements.get(elementName)) {
|
|
16
|
+
customElements.define(elementName, Component);
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
;
|
|
21
|
+
//# sourceMappingURL=register-elements.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"register-elements.js","sourceRoot":"","sources":["../src/register-elements.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,MAAM,gCAAgC,CAAC;AAChE,OAAO,iBAAiB,MAAM,+BAA+B,CAAC;AAE9D,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,IAAY;IACnD,MAAM,QAAQ,GAAG;QACf;YACE,WAAW,EAAE,GAAG,IAAI,UAAU;YAC9B,SAAS,EAAE,kBAAkB,CAAC,IAAI,CAAC;SACpC;QACD;YACE,WAAW,EAAE,GAAG,IAAI,SAAS;YAC7B,SAAS,EAAE,iBAAiB,EAAE;SAC/B;KACF,CAAC;IAEF,KAAK,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,QAAQ,EAAE,CAAC;QAClD,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC;YACrC,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;QAChD,CAAC;IACH,CAAC;AACH,CAAC;AAAA,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"resize-listener.d.ts","sourceRoot":"","sources":["../src/resize-listener.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,OAAO,UAAU,mBAAmB,eAa1C"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import logAndRethrow from './log-and-rethrow.js';
|
|
2
|
+
import recalculatePositions from './utils/recalculate-positions.js';
|
|
3
|
+
export default function setupResizeListener() {
|
|
4
|
+
const abortController = new AbortController();
|
|
5
|
+
window.addEventListener('resize', () => {
|
|
6
|
+
try {
|
|
7
|
+
recalculatePositions();
|
|
8
|
+
}
|
|
9
|
+
catch (error) {
|
|
10
|
+
logAndRethrow(error);
|
|
11
|
+
}
|
|
12
|
+
}, { signal: abortController.signal });
|
|
13
|
+
return () => {
|
|
14
|
+
abortController.abort();
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
;
|
|
18
|
+
//# sourceMappingURL=resize-listener.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"resize-listener.js","sourceRoot":"","sources":["../src/resize-listener.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,sBAAsB,CAAC;AACjD,OAAO,oBAAoB,MAAM,kCAAkC,CAAC;AAEpE,MAAM,CAAC,OAAO,UAAU,mBAAmB;IACzC,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAAC;IAC9C,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE;QACrC,IAAI,CAAC;YACH,oBAAoB,EAAE,CAAC;QACzB,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,EAAE,EAAE,MAAM,EAAE,eAAe,CAAC,MAAM,EAAE,CAAC,CAAC;IAEvC,OAAO,GAAG,EAAE;QACV,eAAe,CAAC,KAAK,EAAE,CAAC;IAC1B,CAAC,CAAC;AACJ,CAAC;AAAA,CAAC"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { AxeOptions, Throttle, Callback, AxeContext } from './types';
|
|
2
|
+
export default function createScanner(name: string, axeContext: AxeContext, axeOptions: AxeOptions, throttle: Required<Throttle>, callback: Callback): () => void;
|
|
3
|
+
//# sourceMappingURL=scanner.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scanner.d.ts","sourceRoot":"","sources":["../src/scanner.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAQ1E,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,QAAQ,cA+HnJ"}
|
package/dist/scanner.js
ADDED
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
import axe from 'axe-core';
|
|
2
|
+
import TaskQueue from './task-queue.js';
|
|
3
|
+
import { elementsWithIssues, enabled, extendedElementsWithIssues } from './state.js';
|
|
4
|
+
import updateElementsWithIssues from './utils/update-elements-with-issues.js';
|
|
5
|
+
import recalculatePositions from './utils/recalculate-positions.js';
|
|
6
|
+
import recalculateScrollableAncestors from './utils/recalculate-scrollable-ancestors.js';
|
|
7
|
+
import supportsAnchorPositioning from './utils/supports-anchor-positioning.js';
|
|
8
|
+
import { issuesUrl } from './constants.js';
|
|
9
|
+
import logAndRethrow from './log-and-rethrow.js';
|
|
10
|
+
export default function createScanner(name, axeContext, axeOptions, throttle, callback) {
|
|
11
|
+
const axeRunningWindowProp = `__${name}_axe_running__`;
|
|
12
|
+
const win = window;
|
|
13
|
+
const taskQueue = new TaskQueue(async () => {
|
|
14
|
+
// We may see errors coming from axe-core when Accented is toggled off and on in qiuck succession,
|
|
15
|
+
// which I've seen happen with hot reloading of a React application.
|
|
16
|
+
// This window property serves as a circuit breaker for that particular case.
|
|
17
|
+
if (win[axeRunningWindowProp]) {
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
try {
|
|
21
|
+
performance.mark('axe-start');
|
|
22
|
+
win[axeRunningWindowProp] = true;
|
|
23
|
+
let result;
|
|
24
|
+
try {
|
|
25
|
+
// TODO (https://github.com/pomerantsev/accented/issues/102):
|
|
26
|
+
// only run Axe on what's changed, not on the whole axeContext
|
|
27
|
+
result = await axe.run(axeContext, {
|
|
28
|
+
elementRef: true,
|
|
29
|
+
// Although axe-core can perform iframe scanning, I haven't succeeded in it,
|
|
30
|
+
// and the docs suggest that the axe-core script should be explicitly included
|
|
31
|
+
// in each of the iframed documents anyway.
|
|
32
|
+
// It seems preferable to disallow iframe scanning and not report issues in elements within iframes
|
|
33
|
+
// in the case that such issues are for some reason reported by axe-core.
|
|
34
|
+
// A consumer of Accented can instead scan the iframed document by calling Accented initialization from that document.
|
|
35
|
+
iframes: false,
|
|
36
|
+
resultTypes: ['violations'],
|
|
37
|
+
...axeOptions
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
catch (error) {
|
|
41
|
+
console.error('Accented: axe-core (the accessibility testing engine) threw an error. ' +
|
|
42
|
+
'Check the `axeOptions` property that you’re passing to Accented. ' +
|
|
43
|
+
`If you still think it’s a bug in Accented, file an issue at ${issuesUrl}.\n`, error);
|
|
44
|
+
result = { violations: [] };
|
|
45
|
+
}
|
|
46
|
+
win[axeRunningWindowProp] = false;
|
|
47
|
+
const axeMeasure = performance.measure('axe', 'axe-start');
|
|
48
|
+
if (!enabled.value) {
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
updateElementsWithIssues(extendedElementsWithIssues, result.violations, window, name);
|
|
52
|
+
callback({
|
|
53
|
+
elementsWithIssues: elementsWithIssues.value,
|
|
54
|
+
scanDuration: Math.round(axeMeasure.duration)
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
catch (error) {
|
|
58
|
+
win[axeRunningWindowProp] = false;
|
|
59
|
+
logAndRethrow(error);
|
|
60
|
+
}
|
|
61
|
+
}, throttle);
|
|
62
|
+
// TODO (https://github.com/pomerantsev/accented/issues/102):
|
|
63
|
+
// limit to what's in axeContext,
|
|
64
|
+
// if that's an element or array of elements (not a selector).
|
|
65
|
+
taskQueue.add(document);
|
|
66
|
+
const accentedElementNames = [`${name}-trigger`, `${name}-dialog`];
|
|
67
|
+
const mutationObserver = new MutationObserver(mutationList => {
|
|
68
|
+
try {
|
|
69
|
+
// We're not interested in mutations that are caused exclusively by the custom elements
|
|
70
|
+
// introduced by Accented.
|
|
71
|
+
const listWithoutAccentedElements = mutationList.filter(mutationRecord => {
|
|
72
|
+
const onlyAccentedElementsAddedOrRemoved = mutationRecord.type === 'childList' &&
|
|
73
|
+
[...mutationRecord.addedNodes].every(node => accentedElementNames.includes(node.nodeName.toLowerCase())) &&
|
|
74
|
+
[...mutationRecord.removedNodes].every(node => accentedElementNames.includes(node.nodeName.toLowerCase()));
|
|
75
|
+
const accentedElementChanged = mutationRecord.type === 'attributes' &&
|
|
76
|
+
accentedElementNames.includes(mutationRecord.target.nodeName.toLowerCase());
|
|
77
|
+
return !(onlyAccentedElementsAddedOrRemoved || accentedElementChanged);
|
|
78
|
+
});
|
|
79
|
+
if (listWithoutAccentedElements.length !== 0 && !supportsAnchorPositioning(window)) {
|
|
80
|
+
// Something has changed in the DOM, so we need to realign all triggers with respective elements.
|
|
81
|
+
recalculatePositions();
|
|
82
|
+
// Elements' scrollable ancestors only change when styles change
|
|
83
|
+
// (specifically when the `display` prop on one of the ancestors changes),
|
|
84
|
+
// so a good place to recalculate the scrollable ancestors for elements is here.
|
|
85
|
+
// In future, we could further optimize this by only recalculating scrollable ancestors for elements that have changed.
|
|
86
|
+
recalculateScrollableAncestors();
|
|
87
|
+
}
|
|
88
|
+
// Exclude all mutations on elements that got the accented attribute added or removed.
|
|
89
|
+
// If we simply exclude all mutations where attributeName = `data-${name}`,
|
|
90
|
+
// we may miss other mutations on those same elements caused by Accented,
|
|
91
|
+
// leading to extra runs of the mutation observer.
|
|
92
|
+
const elementsWithAccentedAttributeChanges = listWithoutAccentedElements.reduce((nodes, mutationRecord) => {
|
|
93
|
+
if (mutationRecord.type === 'attributes' && mutationRecord.attributeName === `data-${name}`) {
|
|
94
|
+
nodes.add(mutationRecord.target);
|
|
95
|
+
}
|
|
96
|
+
return nodes;
|
|
97
|
+
}, new Set());
|
|
98
|
+
const filteredMutationList = listWithoutAccentedElements.filter(mutationRecord => {
|
|
99
|
+
return !elementsWithAccentedAttributeChanges.has(mutationRecord.target);
|
|
100
|
+
});
|
|
101
|
+
taskQueue.addMultiple(filteredMutationList.map(mutationRecord => mutationRecord.target));
|
|
102
|
+
}
|
|
103
|
+
catch (error) {
|
|
104
|
+
logAndRethrow(error);
|
|
105
|
+
}
|
|
106
|
+
});
|
|
107
|
+
// TODO (https://github.com/pomerantsev/accented/issues/102):
|
|
108
|
+
// possibly limit the observer to what's in axeContext,
|
|
109
|
+
// if that's an element or array of elements (not a selector).
|
|
110
|
+
mutationObserver.observe(document, {
|
|
111
|
+
subtree: true,
|
|
112
|
+
childList: true,
|
|
113
|
+
attributes: true,
|
|
114
|
+
characterData: true
|
|
115
|
+
});
|
|
116
|
+
return () => {
|
|
117
|
+
mutationObserver.disconnect();
|
|
118
|
+
};
|
|
119
|
+
}
|
|
120
|
+
//# sourceMappingURL=scanner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scanner.js","sourceRoot":"","sources":["../src/scanner.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scroll-listeners.d.ts","sourceRoot":"","sources":["../src/scroll-listeners.ts"],"names":[],"mappings":"AAKA,MAAM,CAAC,OAAO,UAAU,oBAAoB,eA+B3C"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { effect } from '@preact/signals-core';
|
|
2
|
+
import recalculatePositions from './utils/recalculate-positions.js';
|
|
3
|
+
import { scrollableAncestors } from './state.js';
|
|
4
|
+
import logAndRethrow from './log-and-rethrow.js';
|
|
5
|
+
export default function setupScrollListeners() {
|
|
6
|
+
const documentAbortController = new AbortController();
|
|
7
|
+
document.addEventListener('scroll', () => {
|
|
8
|
+
try {
|
|
9
|
+
recalculatePositions();
|
|
10
|
+
}
|
|
11
|
+
catch (error) {
|
|
12
|
+
logAndRethrow(error);
|
|
13
|
+
}
|
|
14
|
+
}, { signal: documentAbortController.signal });
|
|
15
|
+
const disposeOfEffect = effect(() => {
|
|
16
|
+
// TODO: optimize performance, issue #81
|
|
17
|
+
const elementAbortController = new AbortController();
|
|
18
|
+
for (const scrollableAncestor of scrollableAncestors.value) {
|
|
19
|
+
scrollableAncestor.addEventListener('scroll', () => {
|
|
20
|
+
try {
|
|
21
|
+
recalculatePositions();
|
|
22
|
+
}
|
|
23
|
+
catch (error) {
|
|
24
|
+
logAndRethrow(error);
|
|
25
|
+
}
|
|
26
|
+
}, { signal: elementAbortController.signal });
|
|
27
|
+
}
|
|
28
|
+
return () => {
|
|
29
|
+
elementAbortController.abort();
|
|
30
|
+
};
|
|
31
|
+
});
|
|
32
|
+
return () => {
|
|
33
|
+
documentAbortController.abort();
|
|
34
|
+
disposeOfEffect();
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
;
|
|
38
|
+
//# sourceMappingURL=scroll-listeners.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scroll-listeners.js","sourceRoot":"","sources":["../src/scroll-listeners.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,oBAAoB,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,aAAa,MAAM,sBAAsB,CAAC;AAEjD,MAAM,CAAC,OAAO,UAAU,oBAAoB;IAC1C,MAAM,uBAAuB,GAAG,IAAI,eAAe,EAAE,CAAC;IACtD,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE;QACvC,IAAI,CAAC;YACH,oBAAoB,EAAE,CAAC;QACzB,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,EAAE,EAAE,MAAM,EAAE,uBAAuB,CAAC,MAAM,EAAE,CAAC,CAAC;IAE/C,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,EAAE;QAClC,wCAAwC;QACxC,MAAM,sBAAsB,GAAG,IAAI,eAAe,EAAE,CAAC;QACrD,KAAK,MAAM,kBAAkB,IAAI,mBAAmB,CAAC,KAAK,EAAE,CAAC;YAC3D,kBAAkB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE;gBACjD,IAAI,CAAC;oBACH,oBAAoB,EAAE,CAAC;gBACzB,CAAC;gBAAC,OAAO,KAAK,EAAE,CAAC;oBACf,aAAa,CAAC,KAAK,CAAC,CAAC;gBACvB,CAAC;YACH,CAAC,EAAE,EAAE,MAAM,EAAE,sBAAsB,CAAC,MAAM,EAAE,CAAC,CAAC;QAChD,CAAC;QACD,OAAO,GAAG,EAAE;YACV,sBAAsB,CAAC,KAAK,EAAE,CAAC;QACjC,CAAC,CAAA;IACH,CAAC,CAAC,CAAC;IAEH,OAAO,GAAG,EAAE;QACV,uBAAuB,CAAC,KAAK,EAAE,CAAC;QAChC,eAAe,EAAE,CAAC;IACpB,CAAC,CAAC;AACJ,CAAC;AAAA,CAAC"}
|
package/dist/state.d.ts
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { ElementWithIssues, ExtendedElementWithIssues } from './types';
|
|
2
|
+
export declare const enabled: import("@preact/signals-core").Signal<boolean>;
|
|
3
|
+
export declare const extendedElementsWithIssues: import("@preact/signals-core").Signal<ExtendedElementWithIssues[]>;
|
|
4
|
+
export declare const elementsWithIssues: import("@preact/signals-core").ReadonlySignal<ElementWithIssues[]>;
|
|
5
|
+
export declare const scrollableAncestors: import("@preact/signals-core").ReadonlySignal<Set<HTMLElement>>;
|
|
6
|
+
//# sourceMappingURL=state.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../src/state.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAE5E,eAAO,MAAM,OAAO,gDAAgB,CAAC;AAErC,eAAO,MAAM,0BAA0B,oEAA+C,CAAC;AAEvF,eAAO,MAAM,kBAAkB,oEAG3B,CAAC;AAEL,eAAO,MAAM,mBAAmB,iEAU/B,CAAC"}
|
package/dist/state.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { signal, computed } from '@preact/signals-core';
|
|
2
|
+
export const enabled = signal(false);
|
|
3
|
+
export const extendedElementsWithIssues = signal([]);
|
|
4
|
+
export const elementsWithIssues = computed(() => extendedElementsWithIssues.value.map(extendedElementWithIssues => ({
|
|
5
|
+
element: extendedElementWithIssues.element,
|
|
6
|
+
issues: extendedElementWithIssues.issues.value
|
|
7
|
+
})));
|
|
8
|
+
export const scrollableAncestors = computed(() => extendedElementsWithIssues.value.reduce((scrollableAncestors, extendedElementWithIssues) => {
|
|
9
|
+
for (const scrollableAncestor of extendedElementWithIssues.scrollableAncestors.value) {
|
|
10
|
+
scrollableAncestors.add(scrollableAncestor);
|
|
11
|
+
}
|
|
12
|
+
return scrollableAncestors;
|
|
13
|
+
}, new Set()));
|
|
14
|
+
//# sourceMappingURL=state.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"state.js","sourceRoot":"","sources":["../src/state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAIxD,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;AAErC,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAmC,EAAE,CAAC,CAAC;AAEvF,MAAM,CAAC,MAAM,kBAAkB,GAAG,QAAQ,CAA2B,GAAG,EAAE,CAAC,0BAA0B,CAAC,KAAK,CAAC,GAAG,CAAC,yBAAyB,CAAC,EAAE,CAAC,CAAC;IAC5I,OAAO,EAAE,yBAAyB,CAAC,OAAO;IAC1C,MAAM,EAAE,yBAAyB,CAAC,MAAM,CAAC,KAAK;CAC/C,CAAC,CAAC,CAAC,CAAC;AAEL,MAAM,CAAC,MAAM,mBAAmB,GAAG,QAAQ,CAAmB,GAAG,EAAE,CACjE,0BAA0B,CAAC,KAAK,CAAC,MAAM,CACrC,CAAC,mBAAmB,EAAE,yBAAyB,EAAE,EAAE;IACjD,KAAK,MAAM,kBAAkB,IAAI,yBAAyB,CAAC,mBAAmB,CAAC,KAAK,EAAE,CAAC;QACrF,mBAAmB,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;IAC9C,CAAC;IACD,OAAO,mBAAmB,CAAC;AAC7B,CAAC,EACD,IAAI,GAAG,EAAe,CACvB,CACF,CAAC"}
|
package/dist/task-queue.d.ts
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
|
+
import type { Throttle } from './types';
|
|
1
2
|
type TaskCallback = () => void;
|
|
2
3
|
export default class TaskQueue<T> {
|
|
3
4
|
#private;
|
|
4
|
-
constructor(asyncCallback: TaskCallback,
|
|
5
|
-
|
|
6
|
-
throttleDelay?: number;
|
|
7
|
-
});
|
|
5
|
+
constructor(asyncCallback: TaskCallback, throttle: Required<Throttle>);
|
|
6
|
+
addMultiple(items: Array<T>): void;
|
|
8
7
|
add(item: T): void;
|
|
9
8
|
}
|
|
10
9
|
export {};
|
package/dist/task-queue.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"task-queue.d.ts","sourceRoot":"","sources":["../src/task-queue.ts"],"names":[],"mappings":"AAAA,KAAK,YAAY,GAAG,MAAM,IAAI,CAAC;AAE/B,MAAM,CAAC,OAAO,OAAO,SAAS,CAAC,CAAC;;
|
|
1
|
+
{"version":3,"file":"task-queue.d.ts","sourceRoot":"","sources":["../src/task-queue.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,KAAK,YAAY,GAAG,MAAM,IAAI,CAAC;AAE/B,MAAM,CAAC,OAAO,OAAO,SAAS,CAAC,CAAC;;gBAOlB,aAAa,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,CAAC,QAAQ,CAAC;IAmCrE,WAAW,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC;IAS3B,GAAG,CAAC,IAAI,EAAE,CAAC;CAGZ"}
|
package/dist/task-queue.js
CHANGED
|
@@ -1,40 +1,44 @@
|
|
|
1
1
|
export default class TaskQueue {
|
|
2
|
-
#
|
|
3
|
-
#runningOrScheduled = false;
|
|
4
|
-
#initialDelay;
|
|
5
|
-
#throttleDelay;
|
|
6
|
-
// I'm not sure why the editor needs NodeJS.Timeout here.
|
|
7
|
-
// tsconfig.json doesn't mention that the code needs to run in Node.
|
|
8
|
-
// Maybe it's somehow related to the fact that we're using the Node test runner.
|
|
9
|
-
#timeoutId = null;
|
|
2
|
+
#throttle;
|
|
10
3
|
#asyncCallback = null;
|
|
11
|
-
|
|
4
|
+
#items = new Set();
|
|
5
|
+
#inRunLoop = false;
|
|
6
|
+
constructor(asyncCallback, throttle) {
|
|
12
7
|
this.#asyncCallback = asyncCallback;
|
|
13
|
-
this.#
|
|
14
|
-
this.#throttleDelay = throttleDelay ?? 1000;
|
|
8
|
+
this.#throttle = throttle;
|
|
15
9
|
}
|
|
16
|
-
#
|
|
17
|
-
if (this.#
|
|
18
|
-
this.#runningOrScheduled = false;
|
|
19
|
-
}
|
|
20
|
-
if (this.#timeoutId !== null || this.#items.size === 0) {
|
|
10
|
+
async #preRun() {
|
|
11
|
+
if (this.#inRunLoop) {
|
|
21
12
|
return;
|
|
22
13
|
}
|
|
23
|
-
|
|
24
|
-
this.#
|
|
25
|
-
|
|
14
|
+
this.#inRunLoop = true;
|
|
15
|
+
if (!this.#throttle.leading) {
|
|
16
|
+
await new Promise((resolve) => setTimeout(resolve, this.#throttle.wait));
|
|
17
|
+
}
|
|
18
|
+
await this.#run();
|
|
26
19
|
}
|
|
27
20
|
async #run() {
|
|
21
|
+
if (this.#items.size === 0) {
|
|
22
|
+
this.#inRunLoop = false;
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
28
25
|
this.#items.clear();
|
|
29
26
|
if (this.#asyncCallback) {
|
|
30
27
|
await this.#asyncCallback();
|
|
31
28
|
}
|
|
32
|
-
this.#
|
|
33
|
-
this.#
|
|
29
|
+
await new Promise((resolve) => setTimeout(resolve, this.#throttle.wait));
|
|
30
|
+
await this.#run();
|
|
31
|
+
}
|
|
32
|
+
addMultiple(items) {
|
|
33
|
+
for (const item of items) {
|
|
34
|
+
this.#items.add(item);
|
|
35
|
+
}
|
|
36
|
+
if (this.#items.size > 0) {
|
|
37
|
+
this.#preRun();
|
|
38
|
+
}
|
|
34
39
|
}
|
|
35
40
|
add(item) {
|
|
36
|
-
this
|
|
37
|
-
this.#scheduleRun();
|
|
41
|
+
this.addMultiple([item]);
|
|
38
42
|
}
|
|
39
43
|
}
|
|
40
44
|
//# sourceMappingURL=task-queue.js.map
|
package/dist/task-queue.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"task-queue.js","sourceRoot":"","sources":["../src/task-queue.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"task-queue.js","sourceRoot":"","sources":["../src/task-queue.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,OAAO,OAAO,SAAS;IAC5B,SAAS,CAAW;IACpB,cAAc,GAAwB,IAAI,CAAC;IAE3C,MAAM,GAAG,IAAI,GAAG,EAAK,CAAC;IACtB,UAAU,GAAG,KAAK,CAAC;IAEnB,YAAY,aAA2B,EAAE,QAA4B;QACnE,IAAI,CAAC,cAAc,GAAG,aAAa,CAAC;QACpC,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;IAC5B,CAAC;IAED,KAAK,CAAC,OAAO;QACX,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QAEvB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC;YAC5B,MAAM,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;QAC3E,CAAC;QAED,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;IACpB,CAAC;IAED,KAAK,CAAC,IAAI;QACR,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,EAAE,CAAC;YAC3B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;QAEpB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC9B,CAAC;QAED,MAAM,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;QAEzE,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;IACpB,CAAC;IAED,WAAW,CAAC,KAAe;QACzB,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE,CAAC;YACzB,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC;QACD,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,EAAE,CAAC;QACjB,CAAC;IACH,CAAC;IAED,GAAG,CAAC,IAAO;QACT,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAC3B,CAAC;CACF"}
|
package/dist/types.d.ts
ADDED
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import type axe from 'axe-core';
|
|
2
|
+
import type { Signal } from '@preact/signals-core';
|
|
3
|
+
import type { AccentedTrigger } from './elements/accented-trigger';
|
|
4
|
+
export type Throttle = {
|
|
5
|
+
/**
|
|
6
|
+
* The minimal time between scans.
|
|
7
|
+
*
|
|
8
|
+
* Default: `1000`.
|
|
9
|
+
* */
|
|
10
|
+
wait?: number;
|
|
11
|
+
/**
|
|
12
|
+
* When to run the scan on Accented initialization or on a mutation.
|
|
13
|
+
*
|
|
14
|
+
* If `true`, the scan will run immediately. If `false`, the scan will run after the first throttle delay.
|
|
15
|
+
*
|
|
16
|
+
* Default: `true`.
|
|
17
|
+
* */
|
|
18
|
+
leading?: boolean;
|
|
19
|
+
};
|
|
20
|
+
export type Output = {
|
|
21
|
+
/**
|
|
22
|
+
* Whether to output the issues to the console.
|
|
23
|
+
*
|
|
24
|
+
* Default: `true`.
|
|
25
|
+
* */
|
|
26
|
+
console?: boolean;
|
|
27
|
+
};
|
|
28
|
+
export type AxeContext = axe.ElementContext;
|
|
29
|
+
export declare const allowedAxeOptions: readonly ["rules", "runOnly"];
|
|
30
|
+
export type AxeOptions = Pick<axe.RunOptions, typeof allowedAxeOptions[number]>;
|
|
31
|
+
type CallbackParams = {
|
|
32
|
+
/**
|
|
33
|
+
* The most current array of elements with issues.
|
|
34
|
+
* */
|
|
35
|
+
elementsWithIssues: Array<ElementWithIssues>;
|
|
36
|
+
/**
|
|
37
|
+
* How long the scan took in milliseconds.
|
|
38
|
+
* */
|
|
39
|
+
scanDuration: number;
|
|
40
|
+
};
|
|
41
|
+
export type Callback = (params: CallbackParams) => void;
|
|
42
|
+
export type AccentedOptions = {
|
|
43
|
+
/**
|
|
44
|
+
* The `context` parameter for `axe.run()`.
|
|
45
|
+
*
|
|
46
|
+
* Determines what element(s) to scan for accessibility issues.
|
|
47
|
+
*
|
|
48
|
+
* Accepts a variety of shapes:
|
|
49
|
+
* * an element reference;
|
|
50
|
+
* * a selector;
|
|
51
|
+
* * a `NodeList`;
|
|
52
|
+
* * an include / exclude object;
|
|
53
|
+
* * and more.
|
|
54
|
+
*
|
|
55
|
+
* See documentation: https://www.deque.com/axe/core-documentation/api-documentation/#context-parameter
|
|
56
|
+
*
|
|
57
|
+
* Default: `document`.
|
|
58
|
+
*/
|
|
59
|
+
axeContext?: AxeContext;
|
|
60
|
+
/**
|
|
61
|
+
* The `options` parameter for `axe.run()`.
|
|
62
|
+
*
|
|
63
|
+
* Accented only supports two keys of the `options` object:
|
|
64
|
+
* * `rules`;
|
|
65
|
+
* * `runOnly`.
|
|
66
|
+
*
|
|
67
|
+
* Both properties are optional, and both control
|
|
68
|
+
* which accessibility rules your page is tested against.
|
|
69
|
+
*
|
|
70
|
+
* See documentation: https://www.deque.com/axe/core-documentation/api-documentation/#options-parameter
|
|
71
|
+
*
|
|
72
|
+
* Default: `{}`.
|
|
73
|
+
*/
|
|
74
|
+
axeOptions?: AxeOptions;
|
|
75
|
+
/**
|
|
76
|
+
* The character sequence that’s used in various elements, attributes and stylesheets that Accented adds to the page.
|
|
77
|
+
* * The data attribute that’s added to elements with issues (default: `data-accented`).
|
|
78
|
+
* * The custom elements for the button and the dialog that get created for each element with issues
|
|
79
|
+
* (default: `accented-trigger`, `accented-dialog`).
|
|
80
|
+
* * The CSS cascade layer containing page-wide Accented-specific styles (default: `accented`).
|
|
81
|
+
* * The prefix for some of the CSS custom properties used by Accented (default: `--accented-`).
|
|
82
|
+
* * The window property that’s used to prevent multiple axe-core scans from running simultaneously
|
|
83
|
+
* (default: `__accented_axe_running__`).
|
|
84
|
+
*
|
|
85
|
+
* Only lowercase alphanumeric characters and dashes (-) are allowed in the name,
|
|
86
|
+
* and it must start with a lowercase letter.
|
|
87
|
+
*
|
|
88
|
+
* Default: `accented`.
|
|
89
|
+
*/
|
|
90
|
+
name?: string;
|
|
91
|
+
/**
|
|
92
|
+
* Output options object.
|
|
93
|
+
* */
|
|
94
|
+
output?: Output;
|
|
95
|
+
/**
|
|
96
|
+
* Scan throttling options object.
|
|
97
|
+
* */
|
|
98
|
+
throttle?: Throttle;
|
|
99
|
+
/**
|
|
100
|
+
* A callback that will be called after each scan.
|
|
101
|
+
*
|
|
102
|
+
* Default: `() => {}`.
|
|
103
|
+
* */
|
|
104
|
+
callback?: Callback;
|
|
105
|
+
};
|
|
106
|
+
/**
|
|
107
|
+
* A function that fully disables Accented,
|
|
108
|
+
* stopping the scanning and removing all highlights from the page.
|
|
109
|
+
*/
|
|
110
|
+
export type DisableAccented = () => void;
|
|
111
|
+
export type Position = {
|
|
112
|
+
inlineEndLeft: number;
|
|
113
|
+
blockStartTop: number;
|
|
114
|
+
direction: 'ltr' | 'rtl';
|
|
115
|
+
};
|
|
116
|
+
export type Issue = {
|
|
117
|
+
id: string;
|
|
118
|
+
title: string;
|
|
119
|
+
description: string;
|
|
120
|
+
url: string;
|
|
121
|
+
impact: axe.ImpactValue;
|
|
122
|
+
};
|
|
123
|
+
export type ElementWithIssues = {
|
|
124
|
+
element: HTMLElement;
|
|
125
|
+
issues: Array<Issue>;
|
|
126
|
+
};
|
|
127
|
+
export type ExtendedElementWithIssues = Omit<ElementWithIssues, 'issues'> & {
|
|
128
|
+
issues: Signal<ElementWithIssues['issues']>;
|
|
129
|
+
visible: Signal<boolean>;
|
|
130
|
+
trigger: AccentedTrigger;
|
|
131
|
+
position: Signal<Position>;
|
|
132
|
+
scrollableAncestors: Signal<Set<HTMLElement>>;
|
|
133
|
+
id: number;
|
|
134
|
+
};
|
|
135
|
+
export {};
|
|
136
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,GAAG,MAAM,UAAU,CAAC;AAChC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAEnE,MAAM,MAAM,QAAQ,GAAG;IACrB;;;;SAIK;IACL,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;;;SAMK;IACL,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,MAAM,MAAM,MAAM,GAAG;IACnB;;;;SAIK;IACL,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,GAAG,CAAC,cAAc,CAAC;AAE5C,eAAO,MAAM,iBAAiB,+BAAgC,CAAC;AAE/D,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,OAAO,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC;AAEhF,KAAK,cAAc,GAAG;IACpB;;SAEK;IACL,kBAAkB,EAAE,KAAK,CAAC,iBAAiB,CAAC,CAAC;IAE7C;;SAEK;IACL,YAAY,EAAE,MAAM,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC;AAExD,MAAM,MAAM,eAAe,GAAG;IAE5B;;;;;;;;;;;;;;;OAeG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IAExB;;;;;;;;;;;;;OAaG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IAExB;;;;;;;;;;;;;;OAcG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;SAEK;IACL,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;SAEK;IACL,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB;;;;SAIK;IACL,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACpB,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,IAAI,CAAC;AAEzC,MAAM,MAAM,QAAQ,GAAG;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,KAAK,GAAG,KAAK,CAAA;CACzB,CAAC;AAEF,MAAM,MAAM,KAAK,GAAG;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,GAAG,CAAC,WAAW,CAAA;CACxB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,iBAAiB,EAAE,QAAQ,CAAC,GAAG;IAC1E,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC5C,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACzB,OAAO,EAAE,eAAe,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC3B,mBAAmB,EAAE,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,CAAA;IAC7C,EAAE,EAAE,MAAM,CAAA;CACX,CAAC"}
|
package/dist/types.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAiCA,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,OAAO,EAAE,SAAS,CAAU,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"are-issue-sets-equal.d.ts","sourceRoot":"","sources":["../../src/utils/are-issue-sets-equal.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAItC,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,WAKrF"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
const issueProps = ['id', 'title', 'description', 'url', 'impact'];
|
|
2
|
+
export default function areIssueSetsEqual(issues1, issues2) {
|
|
3
|
+
return issues1.length === issues2.length &&
|
|
4
|
+
issues1.every(issue1 => Boolean(issues2.find(issue2 => issueProps.every(prop => issue2[prop] === issue1[prop]))));
|
|
5
|
+
}
|
|
6
|
+
//# sourceMappingURL=are-issue-sets-equal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"are-issue-sets-equal.js","sourceRoot":"","sources":["../../src/utils/are-issue-sets-equal.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,GAAuB,CAAC,IAAI,EAAE,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;AAEvF,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,OAAqB,EAAE,OAAqB;IACpF,OAAO,OAAO,CAAC,MAAM,KAAK,OAAO,CAAC,MAAM;QACtC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CACpD,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,MAAM,CAAC,IAAI,CAAC,CAAC,CACxD,CAAC,CAAC,CAAC;AACR,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"deep-merge.d.ts","sourceRoot":"","sources":["../../src/utils/deep-merge.ts"],"names":[],"mappings":"AAAA,KAAK,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,GAAG,SAAS,CAejF"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export default function deepMerge(target, source) {
|
|
2
|
+
const output = { ...target };
|
|
3
|
+
for (const key of Object.keys(source)) {
|
|
4
|
+
if (typeof source[key] === 'object' && source[key] !== null && !Array.isArray(source[key])) {
|
|
5
|
+
if (!(key in target)) {
|
|
6
|
+
output[key] = source[key];
|
|
7
|
+
}
|
|
8
|
+
else {
|
|
9
|
+
output[key] = deepMerge(target[key], source[key]);
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
else {
|
|
13
|
+
output[key] = source[key];
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
return output;
|
|
17
|
+
}
|
|
18
|
+
//# sourceMappingURL=deep-merge.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"deep-merge.js","sourceRoot":"","sources":["../../src/utils/deep-merge.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,MAAiB,EAAE,MAAiB;IACpE,MAAM,MAAM,GAAG,EAAC,GAAG,MAAM,EAAC,CAAC;IAC3B,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,IAAI,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,QAAQ,IAAI,MAAM,CAAC,GAAG,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;YAC3F,IAAI,CAAC,CAAC,GAAG,IAAI,MAAM,CAAC,EAAE,CAAC;gBACrB,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;YAC5B,CAAC;iBAAM,CAAC;gBACN,MAAM,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;YACpD,CAAC;QACH,CAAC;aACI,CAAC;YACJ,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;QAC5B,CAAC;IACH,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-element-html.d.ts","sourceRoot":"","sources":["../../src/utils/get-element-html.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,OAAO,EAAE,OAAO,UAYtD"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export default function getElementHtml(element) {
|
|
2
|
+
const outerHtml = element.outerHTML;
|
|
3
|
+
const innerHtml = element.innerHTML;
|
|
4
|
+
if (!innerHtml) {
|
|
5
|
+
return outerHtml;
|
|
6
|
+
}
|
|
7
|
+
const index = outerHtml.indexOf(innerHtml);
|
|
8
|
+
if (index === -1) {
|
|
9
|
+
// This shouldn't be happening, but if it does, we can just return the outer HTML.
|
|
10
|
+
return outerHtml;
|
|
11
|
+
}
|
|
12
|
+
return outerHtml.slice(0, index) + '…' + outerHtml.slice(index + innerHtml.length);
|
|
13
|
+
}
|
|
14
|
+
//# sourceMappingURL=get-element-html.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-element-html.js","sourceRoot":"","sources":["../../src/utils/get-element-html.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,OAAgB;IACrD,MAAM,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;IACpC,MAAM,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;IACpC,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,MAAM,KAAK,GAAG,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IAC3C,IAAI,KAAK,KAAK,CAAC,CAAC,EAAE,CAAC;QACjB,kFAAkF;QAClF,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,OAAO,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,GAAG,GAAG,GAAG,SAAS,CAAC,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC;AACrF,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-element-position.d.ts","sourceRoot":"","sources":["../../src/utils/get-element-position.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEzC,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,GAAG,QAAQ,CAkBlF"}
|