@checkly/playwright-core 1.51.11-beta.2 → 1.51.11
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/package.json +1 -1
- package/lib/common/socksProxy.js +0 -569
- package/lib/common/timeoutSettings.js +0 -73
- package/lib/common/types.js +0 -5
- package/lib/generated/recorderSource.js +0 -7
- package/lib/image_tools/colorUtils.js +0 -98
- package/lib/image_tools/compare.js +0 -108
- package/lib/image_tools/imageChannel.js +0 -70
- package/lib/image_tools/stats.js +0 -102
- package/lib/protocol/transport.js +0 -82
- package/lib/server/recorder/codeGenerator.js +0 -154
- package/lib/server/recorder/csharp.js +0 -311
- package/lib/server/recorder/java.js +0 -249
- package/lib/server/recorder/javascript.js +0 -230
- package/lib/server/recorder/jsonl.js +0 -48
- package/lib/server/recorder/language.js +0 -45
- package/lib/server/recorder/python.js +0 -276
- package/lib/server/recorder/recorderActions.js +0 -6
- package/lib/server/recorder/utils.js +0 -46
- package/lib/third_party/diff_match_patch.js +0 -2222
- package/lib/utils/ascii.js +0 -31
- package/lib/utils/comparators.js +0 -171
- package/lib/utils/crypto.js +0 -174
- package/lib/utils/debug.js +0 -46
- package/lib/utils/debugLogger.js +0 -91
- package/lib/utils/env.js +0 -49
- package/lib/utils/eventsHelper.js +0 -38
- package/lib/utils/glob.js +0 -84
- package/lib/utils/happy-eyeballs.js +0 -210
- package/lib/utils/headers.js +0 -52
- package/lib/utils/hostPlatform.js +0 -133
- package/lib/utils/httpServer.js +0 -237
- package/lib/utils/linuxUtils.js +0 -78
- package/lib/utils/manualPromise.js +0 -109
- package/lib/utils/mimeType.js +0 -30
- package/lib/utils/multimap.js +0 -75
- package/lib/utils/network.js +0 -160
- package/lib/utils/processLauncher.js +0 -248
- package/lib/utils/profiler.js +0 -53
- package/lib/utils/rtti.js +0 -44
- package/lib/utils/semaphore.js +0 -51
- package/lib/utils/spawnAsync.js +0 -45
- package/lib/utils/task.js +0 -58
- package/lib/utils/time.js +0 -37
- package/lib/utils/traceUtils.js +0 -44
- package/lib/utils/userAgent.js +0 -105
- package/lib/utils/wsServer.js +0 -127
- package/lib/utils/zipFile.js +0 -75
- package/lib/vite/traceViewer/sw.bundle.js +0 -7888
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.source = void 0;
|
|
7
|
-
const source = exports.source = "\nvar __commonJS = obj => {\n let required = false;\n let result;\n return function __require() {\n if (!required) {\n required = true;\n let fn;\n for (const name in obj) { fn = obj[name]; break; }\n const module = { exports: {} };\n fn(module.exports, module);\n result = module.exports;\n }\n return result;\n }\n};\nvar __export = (target, all) => {for (var name in all) target[name] = all[name];};\nvar __toESM = mod => ({ ...mod, 'default': mod });\nvar __toCommonJS = mod => ({ ...mod, __esModule: true });\n\n\n// packages/playwright-core/src/server/injected/recorder/recorder.ts\nvar recorder_exports = {};\n__export(recorder_exports, {\n PollingRecorder: () => PollingRecorder,\n Recorder: () => Recorder,\n default: () => recorder_default\n});\nmodule.exports = __toCommonJS(recorder_exports);\n\n// packages/playwright-core/src/server/injected/recorder/clipPaths.ts\nvar svgJson = { \"tagName\": \"svg\", \"children\": [{ \"tagName\": \"defs\", \"children\": [{ \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-gripper\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"d\": \"M5 3h2v2H5zm0 4h2v2H5zm0 4h2v2H5zm4-8h2v2H9zm0 4h2v2H9zm0 4h2v2H9z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-circle-large-filled\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"d\": \"M8 1a6.8 6.8 0 0 1 1.86.253 6.899 6.899 0 0 1 3.083 1.805 6.903 6.903 0 0 1 1.804 3.083C14.916 6.738 15 7.357 15 8s-.084 1.262-.253 1.86a6.9 6.9 0 0 1-.704 1.674 7.157 7.157 0 0 1-2.516 2.509 6.966 6.966 0 0 1-1.668.71A6.984 6.984 0 0 1 8 15a6.984 6.984 0 0 1-1.86-.246 7.098 7.098 0 0 1-1.674-.711 7.3 7.3 0 0 1-1.415-1.094 7.295 7.295 0 0 1-1.094-1.415 7.098 7.098 0 0 1-.71-1.675A6.985 6.985 0 0 1 1 8c0-.643.082-1.262.246-1.86a6.968 6.968 0 0 1 .711-1.667 7.156 7.156 0 0 1 2.509-2.516 6.895 6.895 0 0 1 1.675-.704A6.808 6.808 0 0 1 8 1z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-inspect\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"fill-rule\": \"evenodd\", \"clip-rule\": \"evenodd\", \"d\": \"M1 3l1-1h12l1 1v6h-1V3H2v8h5v1H2l-1-1V3zm14.707 9.707L9 6v9.414l2.707-2.707h4zM10 13V8.414l3.293 3.293h-2L10 13z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-whole-word\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"fill-rule\": \"evenodd\", \"clip-rule\": \"evenodd\", \"d\": \"M0 11H1V13H15V11H16V14H15H1H0V11Z\" } }, { \"tagName\": \"path\", \"attrs\": { \"d\": \"M6.84048 11H5.95963V10.1406H5.93814C5.555 10.7995 4.99104 11.1289 4.24625 11.1289C3.69839 11.1289 3.26871 10.9839 2.95718 10.6938C2.64924 10.4038 2.49527 10.0189 2.49527 9.53906C2.49527 8.51139 3.10041 7.91341 4.3107 7.74512L5.95963 7.51416C5.95963 6.57959 5.58186 6.1123 4.82632 6.1123C4.16389 6.1123 3.56591 6.33789 3.03238 6.78906V5.88672C3.57307 5.54297 4.19612 5.37109 4.90152 5.37109C6.19416 5.37109 6.84048 6.05501 6.84048 7.42285V11ZM5.95963 8.21777L4.63297 8.40039C4.22476 8.45768 3.91682 8.55973 3.70914 8.70654C3.50145 8.84977 3.39761 9.10579 3.39761 9.47461C3.39761 9.74316 3.4925 9.96338 3.68228 10.1353C3.87564 10.3035 4.13166 10.3877 4.45035 10.3877C4.8872 10.3877 5.24706 10.2355 5.52994 9.93115C5.8164 9.62321 5.95963 9.2347 5.95963 8.76562V8.21777Z\" } }, { \"tagName\": \"path\", \"attrs\": { \"d\": \"M9.3475 10.2051H9.32601V11H8.44515V2.85742H9.32601V6.4668H9.3475C9.78076 5.73633 10.4146 5.37109 11.2489 5.37109C11.9543 5.37109 12.5057 5.61816 12.9032 6.1123C13.3042 6.60286 13.5047 7.26172 13.5047 8.08887C13.5047 9.00911 13.2809 9.74674 12.8333 10.3018C12.3857 10.8532 11.7734 11.1289 10.9964 11.1289C10.2695 11.1289 9.71989 10.821 9.3475 10.2051ZM9.32601 7.98682V8.75488C9.32601 9.20964 9.47282 9.59635 9.76644 9.91504C10.0636 10.2301 10.4396 10.3877 10.8944 10.3877C11.4279 10.3877 11.8451 10.1836 12.1458 9.77539C12.4502 9.36719 12.6024 8.79964 12.6024 8.07275C12.6024 7.46045 12.4609 6.98063 12.1781 6.6333C11.8952 6.28597 11.512 6.1123 11.0286 6.1123C10.5166 6.1123 10.1048 6.29134 9.7933 6.64941C9.48177 7.00391 9.32601 7.44971 9.32601 7.98682Z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-eye\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"d\": \"M7.99993 6.00316C9.47266 6.00316 10.6666 7.19708 10.6666 8.66981C10.6666 10.1426 9.47266 11.3365 7.99993 11.3365C6.52715 11.3365 5.33324 10.1426 5.33324 8.66981C5.33324 7.19708 6.52715 6.00316 7.99993 6.00316ZM7.99993 7.00315C7.07946 7.00315 6.33324 7.74935 6.33324 8.66981C6.33324 9.59028 7.07946 10.3365 7.99993 10.3365C8.9204 10.3365 9.6666 9.59028 9.6666 8.66981C9.6666 7.74935 8.9204 7.00315 7.99993 7.00315ZM7.99993 3.66675C11.0756 3.66675 13.7307 5.76675 14.4673 8.70968C14.5344 8.97755 14.3716 9.24908 14.1037 9.31615C13.8358 9.38315 13.5643 9.22041 13.4973 8.95248C12.8713 6.45205 10.6141 4.66675 7.99993 4.66675C5.38454 4.66675 3.12664 6.45359 2.50182 8.95555C2.43491 9.22341 2.16348 9.38635 1.89557 9.31948C1.62766 9.25255 1.46471 8.98115 1.53162 8.71321C2.26701 5.76856 4.9229 3.66675 7.99993 3.66675Z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-symbol-constant\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"fill-rule\": \"evenodd\", \"clip-rule\": \"evenodd\", \"d\": \"M4 6h8v1H4V6zm8 3H4v1h8V9z\" } }, { \"tagName\": \"path\", \"attrs\": { \"fill-rule\": \"evenodd\", \"clip-rule\": \"evenodd\", \"d\": \"M1 4l1-1h12l1 1v8l-1 1H2l-1-1V4zm1 0v8h12V4H2z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-check\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"fill-rule\": \"evenodd\", \"clip-rule\": \"evenodd\", \"d\": \"M14.431 3.323l-8.47 10-.79-.036-3.35-4.77.818-.574 2.978 4.24 8.051-9.506.764.646z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-close\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"fill-rule\": \"evenodd\", \"clip-rule\": \"evenodd\", \"d\": \"M8 8.707l3.646 3.647.708-.707L8.707 8l3.647-3.646-.707-.708L8 7.293 4.354 3.646l-.707.708L7.293 8l-3.646 3.646.707.708L8 8.707z\" } }] }, { \"tagName\": \"clipPath\", \"attrs\": { \"width\": \"16\", \"height\": \"16\", \"viewBox\": \"0 0 16 16\", \"fill\": \"currentColor\", \"id\": \"icon-pass\" }, \"children\": [{ \"tagName\": \"path\", \"attrs\": { \"d\": \"M6.27 10.87h.71l4.56-4.56-.71-.71-4.2 4.21-1.92-1.92L4 8.6l2.27 2.27z\" } }, { \"tagName\": \"path\", \"attrs\": { \"fill-rule\": \"evenodd\", \"clip-rule\": \"evenodd\", \"d\": \"M8.6 1c1.6.1 3.1.9 4.2 2 1.3 1.4 2 3.1 2 5.1 0 1.6-.6 3.1-1.6 4.4-1 1.2-2.4 2.1-4 2.4-1.6.3-3.2.1-4.6-.7-1.4-.8-2.5-2-3.1-3.5C.9 9.2.8 7.5 1.3 6c.5-1.6 1.4-2.9 2.8-3.8C5.4 1.3 7 .9 8.6 1zm.5 12.9c1.3-.3 2.5-1 3.4-2.1.8-1.1 1.3-2.4 1.2-3.8 0-1.6-.6-3.2-1.7-4.3-1-1-2.2-1.6-3.6-1.7-1.3-.1-2.7.2-3.8 1-1.1.8-1.9 1.9-2.3 3.3-.4 1.3-.4 2.7.2 4 .6 1.3 1.5 2.3 2.7 3 1.2.7 2.6.9 3.9.6z\" } }] }] }] };\nvar clipPaths_default = svgJson;\n\n// packages/playwright-core/src/server/injected/recorder/recorder.ts\nvar NoneTool = class {\n cursor() {\n return \"default\";\n }\n};\nvar InspectTool = class {\n constructor(recorder, assertVisibility) {\n this._hoveredModel = null;\n this._hoveredElement = null;\n this._hoveredSelectors = null;\n this._recorder = recorder;\n this._assertVisibility = assertVisibility;\n }\n cursor() {\n return \"pointer\";\n }\n cleanup() {\n this._hoveredModel = null;\n this._hoveredElement = null;\n this._hoveredSelectors = null;\n }\n onClick(event) {\n var _a;\n consumeEvent(event);\n if (event.button !== 0)\n return;\n if ((_a = this._hoveredModel) == null ? void 0 : _a.selector)\n this._commit(this._hoveredModel.selector);\n }\n onContextMenu(event) {\n if (this._hoveredModel && !this._hoveredModel.tooltipListItemSelected && this._hoveredSelectors && this._hoveredSelectors.length > 1) {\n consumeEvent(event);\n const selectors = this._hoveredSelectors;\n this._hoveredModel.tooltipFooter = void 0;\n this._hoveredModel.tooltipList = selectors.map((selector) => this._recorder.injectedScript.utils.asLocator(this._recorder.state.language, selector));\n this._hoveredModel.tooltipListItemSelected = (index) => {\n if (index === void 0)\n this._reset(true);\n else\n this._commit(selectors[index]);\n };\n this._recorder.updateHighlight(this._hoveredModel, true);\n }\n }\n onPointerDown(event) {\n consumeEvent(event);\n }\n onPointerUp(event) {\n consumeEvent(event);\n }\n onMouseDown(event) {\n consumeEvent(event);\n }\n onMouseUp(event) {\n consumeEvent(event);\n }\n onMouseMove(event) {\n var _a;\n consumeEvent(event);\n let target = this._recorder.deepEventTarget(event);\n if (!target.isConnected)\n target = null;\n if (this._hoveredElement === target)\n return;\n this._hoveredElement = target;\n let model = null;\n let selectors = [];\n if (this._hoveredElement) {\n const generated = this._recorder.injectedScript.generateSelector(this._hoveredElement, { testIdAttributeName: this._recorder.state.testIdAttributeName, multiple: false });\n selectors = generated.selectors;\n model = {\n selector: generated.selector,\n elements: generated.elements,\n tooltipText: this._recorder.injectedScript.utils.asLocator(this._recorder.state.language, generated.selector),\n tooltipFooter: selectors.length > 1 ? `Click to select, right-click for more options` : void 0,\n color: this._assertVisibility ? \"#8acae480\" : void 0\n };\n }\n if (((_a = this._hoveredModel) == null ? void 0 : _a.selector) === (model == null ? void 0 : model.selector))\n return;\n this._hoveredModel = model;\n this._hoveredSelectors = selectors;\n this._recorder.updateHighlight(model, true);\n }\n onMouseEnter(event) {\n consumeEvent(event);\n }\n onMouseLeave(event) {\n consumeEvent(event);\n const window = this._recorder.injectedScript.window;\n if (window.top !== window && this._recorder.deepEventTarget(event).nodeType === Node.DOCUMENT_NODE)\n this._reset(true);\n }\n onKeyDown(event) {\n var _a;\n consumeEvent(event);\n if (event.key === \"Escape\") {\n if ((_a = this._hoveredModel) == null ? void 0 : _a.tooltipListItemSelected)\n this._reset(true);\n else if (this._assertVisibility)\n this._recorder.setMode(\"recording\");\n }\n }\n onKeyUp(event) {\n consumeEvent(event);\n }\n onScroll(event) {\n this._reset(false);\n }\n _commit(selector) {\n var _a;\n if (this._assertVisibility) {\n this._recorder.recordAction({\n name: \"assertVisible\",\n selector,\n signals: []\n });\n this._recorder.setMode(\"recording\");\n (_a = this._recorder.overlay) == null ? void 0 : _a.flashToolSucceeded(\"assertingVisibility\");\n } else {\n this._recorder.setSelector(selector);\n }\n }\n _reset(userGesture) {\n this._hoveredElement = null;\n this._hoveredModel = null;\n this._hoveredSelectors = null;\n this._recorder.updateHighlight(null, userGesture);\n }\n};\nvar RecordActionTool = class {\n constructor(recorder) {\n this._performingAction = false;\n this._hoveredModel = null;\n this._hoveredElement = null;\n this._activeModel = null;\n this._expectProgrammaticKeyUp = false;\n this._recorder = recorder;\n }\n cursor() {\n return \"pointer\";\n }\n cleanup() {\n this._hoveredModel = null;\n this._hoveredElement = null;\n this._activeModel = null;\n this._expectProgrammaticKeyUp = false;\n }\n onClick(event) {\n if (isRangeInput(this._hoveredElement))\n return;\n if (event.button === 2 && event.type === \"auxclick\")\n return;\n if (this._shouldIgnoreMouseEvent(event))\n return;\n if (this._actionInProgress(event))\n return;\n if (this._consumedDueToNoModel(event, this._hoveredModel))\n return;\n const checkbox = asCheckbox(this._recorder.deepEventTarget(event));\n if (checkbox) {\n this._performAction({\n name: checkbox.checked ? \"check\" : \"uncheck\",\n selector: this._hoveredModel.selector,\n signals: []\n });\n return;\n }\n this._performAction({\n name: \"click\",\n selector: this._hoveredModel.selector,\n position: positionForEvent(event),\n signals: [],\n button: buttonForEvent(event),\n modifiers: modifiersForEvent(event),\n clickCount: event.detail\n });\n }\n onContextMenu(event) {\n if (this._shouldIgnoreMouseEvent(event))\n return;\n if (this._actionInProgress(event))\n return;\n if (this._consumedDueToNoModel(event, this._hoveredModel))\n return;\n this._performAction({\n name: \"click\",\n selector: this._hoveredModel.selector,\n position: positionForEvent(event),\n signals: [],\n button: \"right\",\n modifiers: 0,\n clickCount: 0\n });\n }\n onPointerDown(event) {\n if (this._shouldIgnoreMouseEvent(event))\n return;\n if (!this._performingAction)\n consumeEvent(event);\n }\n onPointerUp(event) {\n if (this._shouldIgnoreMouseEvent(event))\n return;\n if (!this._performingAction)\n consumeEvent(event);\n }\n onMouseDown(event) {\n if (this._shouldIgnoreMouseEvent(event))\n return;\n if (!this._performingAction)\n consumeEvent(event);\n this._activeModel = this._hoveredModel;\n }\n onMouseUp(event) {\n if (this._shouldIgnoreMouseEvent(event))\n return;\n if (!this._performingAction)\n consumeEvent(event);\n }\n onMouseMove(event) {\n const target = this._recorder.deepEventTarget(event);\n if (this._hoveredElement === target)\n return;\n this._hoveredElement = target;\n this._updateModelForHoveredElement();\n }\n onMouseLeave(event) {\n const window = this._recorder.injectedScript.window;\n if (window.top !== window && this._recorder.deepEventTarget(event).nodeType === Node.DOCUMENT_NODE) {\n this._hoveredElement = null;\n this._updateModelForHoveredElement();\n }\n }\n onFocus(event) {\n this._onFocus(true);\n }\n onInput(event) {\n const target = this._recorder.deepEventTarget(event);\n if (target.nodeName === \"INPUT\" && target.type.toLowerCase() === \"file\") {\n this._recorder.recordAction({\n name: \"setInputFiles\",\n selector: this._activeModel.selector,\n signals: [],\n files: [...target.files || []].map((file) => file.name)\n });\n return;\n }\n if (isRangeInput(target)) {\n this._recorder.recordAction({\n name: \"fill\",\n // must use hoveredModel instead of activeModel for it to work in webkit\n selector: this._hoveredModel.selector,\n signals: [],\n text: target.value\n });\n return;\n }\n if ([\"INPUT\", \"TEXTAREA\"].includes(target.nodeName) || target.isContentEditable) {\n if (target.nodeName === \"INPUT\" && [\"checkbox\", \"radio\"].includes(target.type.toLowerCase())) {\n return;\n }\n if (this._consumedDueWrongTarget(event))\n return;\n this._recorder.recordAction({\n name: \"fill\",\n selector: this._activeModel.selector,\n signals: [],\n text: target.isContentEditable ? target.innerText : target.value\n });\n }\n if (target.nodeName === \"SELECT\") {\n const selectElement = target;\n if (this._actionInProgress(event))\n return;\n this._performAction({\n name: \"select\",\n selector: this._activeModel.selector,\n options: [...selectElement.selectedOptions].map((option) => option.value),\n signals: []\n });\n }\n }\n onKeyDown(event) {\n if (!this._shouldGenerateKeyPressFor(event))\n return;\n if (this._actionInProgress(event)) {\n this._expectProgrammaticKeyUp = true;\n return;\n }\n if (this._consumedDueWrongTarget(event))\n return;\n if (event.key === \" \") {\n const checkbox = asCheckbox(this._recorder.deepEventTarget(event));\n if (checkbox) {\n this._performAction({\n name: checkbox.checked ? \"uncheck\" : \"check\",\n selector: this._activeModel.selector,\n signals: []\n });\n return;\n }\n }\n this._performAction({\n name: \"press\",\n selector: this._activeModel.selector,\n signals: [],\n key: event.key,\n modifiers: modifiersForEvent(event)\n });\n }\n onKeyUp(event) {\n if (!this._shouldGenerateKeyPressFor(event))\n return;\n if (!this._expectProgrammaticKeyUp) {\n consumeEvent(event);\n return;\n }\n this._expectProgrammaticKeyUp = false;\n }\n onScroll(event) {\n this._hoveredModel = null;\n this._hoveredElement = null;\n this._recorder.updateHighlight(null, false);\n }\n _onFocus(userGesture) {\n const activeElement = deepActiveElement(this._recorder.document);\n if (userGesture && activeElement === this._recorder.document.body)\n return;\n const result = activeElement ? this._recorder.injectedScript.generateSelector(activeElement, { testIdAttributeName: this._recorder.state.testIdAttributeName }) : null;\n this._activeModel = result && result.selector ? result : null;\n if (userGesture)\n this._hoveredElement = activeElement;\n this._updateModelForHoveredElement();\n }\n _shouldIgnoreMouseEvent(event) {\n const target = this._recorder.deepEventTarget(event);\n const nodeName = target.nodeName;\n if (nodeName === \"SELECT\" || nodeName === \"OPTION\")\n return true;\n if (nodeName === \"INPUT\" && [\"date\", \"range\"].includes(target.type))\n return true;\n return false;\n }\n _actionInProgress(event) {\n if (this._performingAction)\n return true;\n consumeEvent(event);\n return false;\n }\n _consumedDueToNoModel(event, model) {\n if (model)\n return false;\n consumeEvent(event);\n return true;\n }\n _consumedDueWrongTarget(event) {\n if (this._activeModel && this._activeModel.elements[0] === this._recorder.deepEventTarget(event))\n return false;\n consumeEvent(event);\n return true;\n }\n _performAction(action) {\n this._hoveredElement = null;\n this._hoveredModel = null;\n this._activeModel = null;\n this._recorder.updateHighlight(null, false);\n this._performingAction = true;\n void this._recorder.performAction(action).then(() => {\n this._performingAction = false;\n this._onFocus(false);\n if (this._recorder.injectedScript.isUnderTest) {\n console.error(\"Action performed for test: \" + JSON.stringify({\n // eslint-disable-line no-console\n hovered: this._hoveredModel ? this._hoveredModel.selector : null,\n active: this._activeModel ? this._activeModel.selector : null\n }));\n }\n });\n }\n _shouldGenerateKeyPressFor(event) {\n if (event.key === \"Enter\" && (this._recorder.deepEventTarget(event).nodeName === \"TEXTAREA\" || this._recorder.deepEventTarget(event).isContentEditable))\n return false;\n if ([\"Backspace\", \"Delete\", \"AltGraph\"].includes(event.key))\n return false;\n if (event.key === \"@\" && event.code === \"KeyL\")\n return false;\n if (navigator.platform.includes(\"Mac\")) {\n if (event.key === \"v\" && event.metaKey)\n return false;\n } else {\n if (event.key === \"v\" && event.ctrlKey)\n return false;\n if (event.key === \"Insert\" && event.shiftKey)\n return false;\n }\n if ([\"Shift\", \"Control\", \"Meta\", \"Alt\", \"Process\"].includes(event.key))\n return false;\n const hasModifier = event.ctrlKey || event.altKey || event.metaKey;\n if (event.key.length === 1 && !hasModifier)\n return !!asCheckbox(this._recorder.deepEventTarget(event));\n return true;\n }\n _updateModelForHoveredElement() {\n if (!this._hoveredElement || !this._hoveredElement.isConnected) {\n this._hoveredModel = null;\n this._hoveredElement = null;\n this._recorder.updateHighlight(null, true);\n return;\n }\n const { selector, elements } = this._recorder.injectedScript.generateSelector(this._hoveredElement, { testIdAttributeName: this._recorder.state.testIdAttributeName });\n if (this._hoveredModel && this._hoveredModel.selector === selector)\n return;\n this._hoveredModel = selector ? { selector, elements, color: \"#dc6f6f7f\" } : null;\n this._recorder.updateHighlight(this._hoveredModel, true);\n }\n};\nvar TextAssertionTool = class {\n constructor(recorder, kind) {\n this._hoverHighlight = null;\n this._action = null;\n this._textCache = /* @__PURE__ */ new Map();\n this._recorder = recorder;\n this._kind = kind;\n this._dialog = new Dialog(recorder);\n }\n cursor() {\n return \"pointer\";\n }\n cleanup() {\n this._dialog.close();\n this._hoverHighlight = null;\n }\n onClick(event) {\n consumeEvent(event);\n if (this._kind === \"value\") {\n this._commitAssertValue();\n } else {\n if (!this._dialog.isShowing())\n this._showDialog();\n }\n }\n onMouseDown(event) {\n const target = this._recorder.deepEventTarget(event);\n if (this._elementHasValue(target))\n event.preventDefault();\n }\n onPointerUp(event) {\n var _a;\n const target = (_a = this._hoverHighlight) == null ? void 0 : _a.elements[0];\n if (this._kind === \"value\" && target && (target.nodeName === \"INPUT\" || target.nodeName === \"SELECT\") && target.disabled) {\n this._commitAssertValue();\n }\n }\n onMouseMove(event) {\n var _a;\n if (this._dialog.isShowing())\n return;\n const target = this._recorder.deepEventTarget(event);\n if (((_a = this._hoverHighlight) == null ? void 0 : _a.elements[0]) === target)\n return;\n if (this._kind === \"text\")\n this._hoverHighlight = this._recorder.injectedScript.utils.elementText(this._textCache, target).full ? { elements: [target], selector: \"\" } : null;\n else\n this._hoverHighlight = this._elementHasValue(target) ? this._recorder.injectedScript.generateSelector(target, { testIdAttributeName: this._recorder.state.testIdAttributeName }) : null;\n if (this._hoverHighlight)\n this._hoverHighlight.color = \"#8acae480\";\n this._recorder.updateHighlight(this._hoverHighlight, true);\n }\n onKeyDown(event) {\n if (event.key === \"Escape\")\n this._recorder.setMode(\"recording\");\n consumeEvent(event);\n }\n onScroll(event) {\n this._recorder.updateHighlight(this._hoverHighlight, false);\n }\n _elementHasValue(element) {\n return element.nodeName === \"TEXTAREA\" || element.nodeName === \"SELECT\" || element.nodeName === \"INPUT\" && ![\"button\", \"image\", \"reset\", \"submit\"].includes(element.type);\n }\n _generateAction() {\n var _a;\n this._textCache.clear();\n const target = (_a = this._hoverHighlight) == null ? void 0 : _a.elements[0];\n if (!target)\n return null;\n if (this._kind === \"value\") {\n if (!this._elementHasValue(target))\n return null;\n const { selector } = this._recorder.injectedScript.generateSelector(target, { testIdAttributeName: this._recorder.state.testIdAttributeName });\n if (target.nodeName === \"INPUT\" && [\"checkbox\", \"radio\"].includes(target.type.toLowerCase())) {\n return {\n name: \"assertChecked\",\n selector,\n signals: [],\n // Interestingly, inputElement.checked is reversed inside this event handler.\n checked: !target.checked\n };\n } else {\n return {\n name: \"assertValue\",\n selector,\n signals: [],\n value: target.value\n };\n }\n } else {\n this._hoverHighlight = this._recorder.injectedScript.generateSelector(target, { testIdAttributeName: this._recorder.state.testIdAttributeName, forTextExpect: true });\n this._hoverHighlight.color = \"#8acae480\";\n this._recorder.updateHighlight(this._hoverHighlight, true);\n return {\n name: \"assertText\",\n selector: this._hoverHighlight.selector,\n signals: [],\n text: this._recorder.injectedScript.utils.elementText(this._textCache, target).normalized,\n substring: true\n };\n }\n }\n _renderValue(action) {\n if ((action == null ? void 0 : action.name) === \"assertText\")\n return this._recorder.injectedScript.utils.normalizeWhiteSpace(action.text);\n if ((action == null ? void 0 : action.name) === \"assertChecked\")\n return String(action.checked);\n if ((action == null ? void 0 : action.name) === \"assertValue\")\n return action.value;\n return \"\";\n }\n _commit() {\n if (!this._action || !this._dialog.isShowing())\n return;\n this._dialog.close();\n this._recorder.recordAction(this._action);\n this._recorder.setMode(\"recording\");\n }\n _showDialog() {\n var _a;\n if (!((_a = this._hoverHighlight) == null ? void 0 : _a.elements[0]))\n return;\n this._action = this._generateAction();\n if (!this._action || this._action.name !== \"assertText\")\n return;\n const action = this._action;\n const textElement = this._recorder.document.createElement(\"textarea\");\n textElement.setAttribute(\"spellcheck\", \"false\");\n textElement.value = this._renderValue(this._action);\n textElement.classList.add(\"text-editor\");\n const updateAndValidate = () => {\n var _a2;\n const newValue = this._recorder.injectedScript.utils.normalizeWhiteSpace(textElement.value);\n const target = (_a2 = this._hoverHighlight) == null ? void 0 : _a2.elements[0];\n if (!target)\n return;\n action.text = newValue;\n const targetText = this._recorder.injectedScript.utils.elementText(this._textCache, target).normalized;\n const matches = newValue && targetText.includes(newValue);\n textElement.classList.toggle(\"does-not-match\", !matches);\n };\n textElement.addEventListener(\"input\", updateAndValidate);\n const label = \"Assert that element contains text\";\n const dialogElement = this._dialog.show({\n label,\n body: textElement,\n onCommit: () => this._commit()\n });\n const position = this._recorder.highlight.tooltipPosition(this._recorder.highlight.firstBox(), dialogElement);\n this._dialog.moveTo(position.anchorTop, position.anchorLeft);\n textElement.focus();\n }\n _commitAssertValue() {\n var _a;\n if (this._kind !== \"value\")\n return;\n const action = this._generateAction();\n if (!action)\n return;\n this._recorder.recordAction(action);\n this._recorder.setMode(\"recording\");\n (_a = this._recorder.overlay) == null ? void 0 : _a.flashToolSucceeded(\"assertingValue\");\n }\n};\nvar Overlay = class {\n constructor(recorder) {\n this._listeners = [];\n this._offsetX = 0;\n this._measure = { width: 0, height: 0 };\n this._recorder = recorder;\n const document = this._recorder.document;\n this._overlayElement = document.createElement(\"x-pw-overlay\");\n this._overlayElement.appendChild(createSvgElement(this._recorder.document, clipPaths_default));\n const toolsListElement = document.createElement(\"x-pw-tools-list\");\n this._overlayElement.appendChild(toolsListElement);\n this._dragHandle = document.createElement(\"x-pw-tool-gripper\");\n this._dragHandle.appendChild(document.createElement(\"x-div\"));\n toolsListElement.appendChild(this._dragHandle);\n this._recordToggle = this._recorder.document.createElement(\"x-pw-tool-item\");\n this._recordToggle.title = \"Record\";\n this._recordToggle.classList.add(\"record\");\n this._recordToggle.appendChild(this._recorder.document.createElement(\"x-div\"));\n toolsListElement.appendChild(this._recordToggle);\n this._pickLocatorToggle = this._recorder.document.createElement(\"x-pw-tool-item\");\n this._pickLocatorToggle.title = \"Pick locator\";\n this._pickLocatorToggle.classList.add(\"pick-locator\");\n this._pickLocatorToggle.appendChild(this._recorder.document.createElement(\"x-div\"));\n toolsListElement.appendChild(this._pickLocatorToggle);\n this._assertVisibilityToggle = this._recorder.document.createElement(\"x-pw-tool-item\");\n this._assertVisibilityToggle.title = \"Assert visibility\";\n this._assertVisibilityToggle.classList.add(\"visibility\");\n this._assertVisibilityToggle.appendChild(this._recorder.document.createElement(\"x-div\"));\n toolsListElement.appendChild(this._assertVisibilityToggle);\n this._assertTextToggle = this._recorder.document.createElement(\"x-pw-tool-item\");\n this._assertTextToggle.title = \"Assert text\";\n this._assertTextToggle.classList.add(\"text\");\n this._assertTextToggle.appendChild(this._recorder.document.createElement(\"x-div\"));\n toolsListElement.appendChild(this._assertTextToggle);\n this._assertValuesToggle = this._recorder.document.createElement(\"x-pw-tool-item\");\n this._assertValuesToggle.title = \"Assert value\";\n this._assertValuesToggle.classList.add(\"value\");\n this._assertValuesToggle.appendChild(this._recorder.document.createElement(\"x-div\"));\n toolsListElement.appendChild(this._assertValuesToggle);\n this._updateVisualPosition();\n this._refreshListeners();\n }\n _refreshListeners() {\n removeEventListeners(this._listeners);\n this._listeners = [\n addEventListener(this._dragHandle, \"mousedown\", (event) => {\n this._dragState = { offsetX: this._offsetX, dragStart: { x: event.clientX, y: 0 } };\n }),\n addEventListener(this._recordToggle, \"click\", () => {\n this._recorder.setMode(this._recorder.state.mode === \"none\" || this._recorder.state.mode === \"standby\" || this._recorder.state.mode === \"inspecting\" ? \"recording\" : \"standby\");\n }),\n addEventListener(this._pickLocatorToggle, \"click\", () => {\n const newMode = {\n \"inspecting\": \"standby\",\n \"none\": \"inspecting\",\n \"standby\": \"inspecting\",\n \"recording\": \"recording-inspecting\",\n \"recording-inspecting\": \"recording\",\n \"assertingText\": \"recording-inspecting\",\n \"assertingVisibility\": \"recording-inspecting\",\n \"assertingValue\": \"recording-inspecting\"\n };\n this._recorder.setMode(newMode[this._recorder.state.mode]);\n }),\n addEventListener(this._assertVisibilityToggle, \"click\", () => {\n if (!this._assertVisibilityToggle.classList.contains(\"disabled\"))\n this._recorder.setMode(this._recorder.state.mode === \"assertingVisibility\" ? \"recording\" : \"assertingVisibility\");\n }),\n addEventListener(this._assertTextToggle, \"click\", () => {\n if (!this._assertTextToggle.classList.contains(\"disabled\"))\n this._recorder.setMode(this._recorder.state.mode === \"assertingText\" ? \"recording\" : \"assertingText\");\n }),\n addEventListener(this._assertValuesToggle, \"click\", () => {\n if (!this._assertValuesToggle.classList.contains(\"disabled\"))\n this._recorder.setMode(this._recorder.state.mode === \"assertingValue\" ? \"recording\" : \"assertingValue\");\n })\n ];\n }\n install() {\n this._recorder.highlight.appendChild(this._overlayElement);\n this._refreshListeners();\n this._updateVisualPosition();\n }\n contains(element) {\n return this._recorder.injectedScript.utils.isInsideScope(this._overlayElement, element);\n }\n setUIState(state) {\n this._recordToggle.classList.toggle(\"active\", state.mode === \"recording\" || state.mode === \"assertingText\" || state.mode === \"assertingVisibility\" || state.mode === \"assertingValue\" || state.mode === \"recording-inspecting\");\n this._pickLocatorToggle.classList.toggle(\"active\", state.mode === \"inspecting\" || state.mode === \"recording-inspecting\");\n this._assertVisibilityToggle.classList.toggle(\"active\", state.mode === \"assertingVisibility\");\n this._assertVisibilityToggle.classList.toggle(\"disabled\", state.mode === \"none\" || state.mode === \"standby\" || state.mode === \"inspecting\");\n this._assertTextToggle.classList.toggle(\"active\", state.mode === \"assertingText\");\n this._assertTextToggle.classList.toggle(\"disabled\", state.mode === \"none\" || state.mode === \"standby\" || state.mode === \"inspecting\");\n this._assertValuesToggle.classList.toggle(\"active\", state.mode === \"assertingValue\");\n this._assertValuesToggle.classList.toggle(\"disabled\", state.mode === \"none\" || state.mode === \"standby\" || state.mode === \"inspecting\");\n if (this._offsetX !== state.overlay.offsetX) {\n this._offsetX = state.overlay.offsetX;\n this._updateVisualPosition();\n }\n if (state.mode === \"none\")\n this._hideOverlay();\n else\n this._showOverlay();\n }\n flashToolSucceeded(tool) {\n const element = tool === \"assertingVisibility\" ? this._assertVisibilityToggle : this._assertValuesToggle;\n element.classList.add(\"succeeded\");\n this._recorder.injectedScript.builtinSetTimeout(() => element.classList.remove(\"succeeded\"), 2e3);\n }\n _hideOverlay() {\n this._overlayElement.setAttribute(\"hidden\", \"true\");\n }\n _showOverlay() {\n if (!this._overlayElement.hasAttribute(\"hidden\"))\n return;\n this._overlayElement.removeAttribute(\"hidden\");\n this._updateVisualPosition();\n }\n _updateVisualPosition() {\n this._measure = this._overlayElement.getBoundingClientRect();\n this._overlayElement.style.left = (this._recorder.injectedScript.window.innerWidth - this._measure.width) / 2 + this._offsetX + \"px\";\n }\n onMouseMove(event) {\n if (!event.buttons) {\n this._dragState = void 0;\n return false;\n }\n if (this._dragState) {\n this._offsetX = this._dragState.offsetX + event.clientX - this._dragState.dragStart.x;\n const halfGapSize = (this._recorder.injectedScript.window.innerWidth - this._measure.width) / 2 - 10;\n this._offsetX = Math.max(-halfGapSize, Math.min(halfGapSize, this._offsetX));\n this._updateVisualPosition();\n this._recorder.setOverlayState({ offsetX: this._offsetX });\n consumeEvent(event);\n return true;\n }\n return false;\n }\n onMouseUp(event) {\n if (this._dragState) {\n consumeEvent(event);\n return true;\n }\n return false;\n }\n onClick(event) {\n if (this._dragState) {\n this._dragState = void 0;\n consumeEvent(event);\n return true;\n }\n return false;\n }\n};\nvar Recorder = class {\n constructor(injectedScript) {\n this._listeners = [];\n this._actionSelectorModel = null;\n this.state = {\n mode: \"none\",\n testIdAttributeName: \"data-testid\",\n language: \"javascript\",\n overlay: { offsetX: 0 }\n };\n this._delegate = {};\n this.document = injectedScript.document;\n this.injectedScript = injectedScript;\n this.highlight = injectedScript.createHighlight();\n this._tools = {\n \"none\": new NoneTool(),\n \"standby\": new NoneTool(),\n \"inspecting\": new InspectTool(this, false),\n \"recording\": new RecordActionTool(this),\n \"recording-inspecting\": new InspectTool(this, false),\n \"assertingText\": new TextAssertionTool(this, \"text\"),\n \"assertingVisibility\": new InspectTool(this, true),\n \"assertingValue\": new TextAssertionTool(this, \"value\")\n };\n this._currentTool = this._tools.none;\n if (injectedScript.window.top === injectedScript.window) {\n this.overlay = new Overlay(this);\n this.overlay.setUIState(this.state);\n }\n this._stylesheet = new injectedScript.window.CSSStyleSheet();\n this._stylesheet.replaceSync(`\n body[data-pw-cursor=pointer] *, body[data-pw-cursor=pointer] *::after { cursor: pointer !important; }\n body[data-pw-cursor=text] *, body[data-pw-cursor=text] *::after { cursor: text !important; }\n `);\n this.installListeners();\n injectedScript.utils.cacheNormalizedWhitespaces();\n if (injectedScript.isUnderTest)\n console.error(\"Recorder script ready for test\");\n }\n installListeners() {\n var _a;\n removeEventListeners(this._listeners);\n this._listeners = [\n addEventListener(this.document, \"click\", (event) => this._onClick(event), true),\n addEventListener(this.document, \"auxclick\", (event) => this._onClick(event), true),\n addEventListener(this.document, \"contextmenu\", (event) => this._onContextMenu(event), true),\n addEventListener(this.document, \"dragstart\", (event) => this._onDragStart(event), true),\n addEventListener(this.document, \"input\", (event) => this._onInput(event), true),\n addEventListener(this.document, \"keydown\", (event) => this._onKeyDown(event), true),\n addEventListener(this.document, \"keyup\", (event) => this._onKeyUp(event), true),\n addEventListener(this.document, \"pointerdown\", (event) => this._onPointerDown(event), true),\n addEventListener(this.document, \"pointerup\", (event) => this._onPointerUp(event), true),\n addEventListener(this.document, \"mousedown\", (event) => this._onMouseDown(event), true),\n addEventListener(this.document, \"mouseup\", (event) => this._onMouseUp(event), true),\n addEventListener(this.document, \"mousemove\", (event) => this._onMouseMove(event), true),\n addEventListener(this.document, \"mouseleave\", (event) => this._onMouseLeave(event), true),\n addEventListener(this.document, \"mouseenter\", (event) => this._onMouseEnter(event), true),\n addEventListener(this.document, \"focus\", (event) => this._onFocus(event), true),\n addEventListener(this.document, \"scroll\", (event) => this._onScroll(event), true)\n ];\n this.highlight.install();\n (_a = this.overlay) == null ? void 0 : _a.install();\n this.document.adoptedStyleSheets.push(this._stylesheet);\n }\n _switchCurrentTool() {\n var _a, _b, _c;\n const newTool = this._tools[this.state.mode];\n if (newTool === this._currentTool)\n return;\n (_b = (_a = this._currentTool).cleanup) == null ? void 0 : _b.call(_a);\n this.clearHighlight();\n this._currentTool = newTool;\n (_c = this.injectedScript.document.body) == null ? void 0 : _c.setAttribute(\"data-pw-cursor\", newTool.cursor());\n }\n setUIState(state, delegate) {\n var _a, _b, _c, _d;\n this._delegate = delegate;\n if (state.actionPoint && this.state.actionPoint && state.actionPoint.x === this.state.actionPoint.x && state.actionPoint.y === this.state.actionPoint.y) {\n } else if (!state.actionPoint && !this.state.actionPoint) {\n } else {\n if (state.actionPoint)\n this.highlight.showActionPoint(state.actionPoint.x, state.actionPoint.y);\n else\n this.highlight.hideActionPoint();\n }\n this.state = state;\n this.highlight.setLanguage(state.language);\n this._switchCurrentTool();\n (_a = this.overlay) == null ? void 0 : _a.setUIState(state);\n if (((_b = this._actionSelectorModel) == null ? void 0 : _b.selector) && !((_c = this._actionSelectorModel) == null ? void 0 : _c.elements.length))\n this._actionSelectorModel = null;\n if (state.actionSelector !== ((_d = this._actionSelectorModel) == null ? void 0 : _d.selector))\n this._actionSelectorModel = state.actionSelector ? querySelector(this.injectedScript, state.actionSelector, this.document) : null;\n if (this.state.mode === \"none\" || this.state.mode === \"standby\")\n this.updateHighlight(this._actionSelectorModel, false);\n }\n clearHighlight() {\n var _a, _b;\n (_b = (_a = this._currentTool).cleanup) == null ? void 0 : _b.call(_a);\n this.updateHighlight(null, false);\n }\n _onClick(event) {\n var _a, _b, _c;\n if (!event.isTrusted)\n return;\n if ((_a = this.overlay) == null ? void 0 : _a.onClick(event))\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_c = (_b = this._currentTool).onClick) == null ? void 0 : _c.call(_b, event);\n }\n _onContextMenu(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onContextMenu) == null ? void 0 : _b.call(_a, event);\n }\n _onDragStart(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onDragStart) == null ? void 0 : _b.call(_a, event);\n }\n _onPointerDown(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onPointerDown) == null ? void 0 : _b.call(_a, event);\n }\n _onPointerUp(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onPointerUp) == null ? void 0 : _b.call(_a, event);\n }\n _onMouseDown(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onMouseDown) == null ? void 0 : _b.call(_a, event);\n }\n _onMouseUp(event) {\n var _a, _b, _c;\n if (!event.isTrusted)\n return;\n if ((_a = this.overlay) == null ? void 0 : _a.onMouseUp(event))\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_c = (_b = this._currentTool).onMouseUp) == null ? void 0 : _c.call(_b, event);\n }\n _onMouseMove(event) {\n var _a, _b, _c;\n if (!event.isTrusted)\n return;\n if ((_a = this.overlay) == null ? void 0 : _a.onMouseMove(event))\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_c = (_b = this._currentTool).onMouseMove) == null ? void 0 : _c.call(_b, event);\n }\n _onMouseEnter(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onMouseEnter) == null ? void 0 : _b.call(_a, event);\n }\n _onMouseLeave(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onMouseLeave) == null ? void 0 : _b.call(_a, event);\n }\n _onFocus(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onFocus) == null ? void 0 : _b.call(_a, event);\n }\n _onScroll(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n this.highlight.hideActionPoint();\n (_b = (_a = this._currentTool).onScroll) == null ? void 0 : _b.call(_a, event);\n }\n _onInput(event) {\n var _a, _b;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onInput) == null ? void 0 : _b.call(_a, event);\n }\n _onKeyDown(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onKeyDown) == null ? void 0 : _b.call(_a, event);\n }\n _onKeyUp(event) {\n var _a, _b;\n if (!event.isTrusted)\n return;\n if (this._ignoreOverlayEvent(event))\n return;\n (_b = (_a = this._currentTool).onKeyUp) == null ? void 0 : _b.call(_a, event);\n }\n updateHighlight(model, userGesture) {\n var _a, _b;\n let tooltipText = model == null ? void 0 : model.tooltipText;\n if (tooltipText === void 0 && !(model == null ? void 0 : model.tooltipList) && (model == null ? void 0 : model.selector))\n tooltipText = this.injectedScript.utils.asLocator(this.state.language, model.selector);\n this.highlight.updateHighlight((model == null ? void 0 : model.elements) || [], { ...model, tooltipText });\n if (userGesture)\n (_b = (_a = this._delegate).highlightUpdated) == null ? void 0 : _b.call(_a);\n }\n _ignoreOverlayEvent(event) {\n return event.composedPath().some((e) => {\n const nodeName = e.nodeName || \"\";\n return nodeName.toLowerCase() === \"x-pw-glass\";\n });\n }\n deepEventTarget(event) {\n var _a;\n for (const element of event.composedPath()) {\n if (!((_a = this.overlay) == null ? void 0 : _a.contains(element)))\n return element;\n }\n return event.composedPath()[0];\n }\n setMode(mode) {\n var _a, _b;\n void ((_b = (_a = this._delegate).setMode) == null ? void 0 : _b.call(_a, mode));\n }\n async performAction(action) {\n var _a, _b;\n await ((_b = (_a = this._delegate).performAction) == null ? void 0 : _b.call(_a, action).catch(() => {\n }));\n }\n recordAction(action) {\n var _a, _b;\n void ((_b = (_a = this._delegate).recordAction) == null ? void 0 : _b.call(_a, action));\n }\n setOverlayState(state) {\n var _a, _b;\n void ((_b = (_a = this._delegate).setOverlayState) == null ? void 0 : _b.call(_a, state));\n }\n setSelector(selector) {\n var _a, _b;\n void ((_b = (_a = this._delegate).setSelector) == null ? void 0 : _b.call(_a, selector));\n }\n};\nvar Dialog = class {\n constructor(recorder) {\n this._dialogElement = null;\n this._recorder = recorder;\n }\n isShowing() {\n return !!this._dialogElement;\n }\n show(options) {\n const acceptButton = this._recorder.document.createElement(\"x-pw-tool-item\");\n acceptButton.title = \"Accept\";\n acceptButton.classList.add(\"accept\");\n acceptButton.appendChild(this._recorder.document.createElement(\"x-div\"));\n acceptButton.addEventListener(\"click\", () => options.onCommit());\n const cancelButton = this._recorder.document.createElement(\"x-pw-tool-item\");\n cancelButton.title = \"Close\";\n cancelButton.classList.add(\"cancel\");\n cancelButton.appendChild(this._recorder.document.createElement(\"x-div\"));\n cancelButton.addEventListener(\"click\", () => {\n var _a;\n this.close();\n (_a = options.onCancel) == null ? void 0 : _a.call(options);\n });\n this._dialogElement = this._recorder.document.createElement(\"x-pw-dialog\");\n this._keyboardListener = (event) => {\n var _a;\n if (event.key === \"Escape\") {\n this.close();\n (_a = options.onCancel) == null ? void 0 : _a.call(options);\n return;\n }\n if (event.key === \"Enter\" && (event.ctrlKey || event.metaKey)) {\n if (this._dialogElement)\n options.onCommit();\n return;\n }\n };\n this._recorder.document.addEventListener(\"keydown\", this._keyboardListener, true);\n const toolbarElement = this._recorder.document.createElement(\"x-pw-tools-list\");\n const labelElement = this._recorder.document.createElement(\"label\");\n labelElement.textContent = options.label;\n toolbarElement.appendChild(labelElement);\n toolbarElement.appendChild(this._recorder.document.createElement(\"x-spacer\"));\n toolbarElement.appendChild(acceptButton);\n toolbarElement.appendChild(cancelButton);\n this._dialogElement.appendChild(toolbarElement);\n const bodyElement = this._recorder.document.createElement(\"x-pw-dialog-body\");\n bodyElement.appendChild(options.body);\n this._dialogElement.appendChild(bodyElement);\n this._recorder.highlight.appendChild(this._dialogElement);\n return this._dialogElement;\n }\n moveTo(top, left) {\n if (!this._dialogElement)\n return;\n this._dialogElement.style.top = top + \"px\";\n this._dialogElement.style.left = left + \"px\";\n }\n close() {\n if (!this._dialogElement)\n return;\n this._dialogElement.remove();\n this._recorder.document.removeEventListener(\"keydown\", this._keyboardListener);\n this._dialogElement = null;\n }\n};\nfunction deepActiveElement(document) {\n let activeElement = document.activeElement;\n while (activeElement && activeElement.shadowRoot && activeElement.shadowRoot.activeElement)\n activeElement = activeElement.shadowRoot.activeElement;\n return activeElement;\n}\nfunction modifiersForEvent(event) {\n return (event.altKey ? 1 : 0) | (event.ctrlKey ? 2 : 0) | (event.metaKey ? 4 : 0) | (event.shiftKey ? 8 : 0);\n}\nfunction buttonForEvent(event) {\n switch (event.which) {\n case 1:\n return \"left\";\n case 2:\n return \"middle\";\n case 3:\n return \"right\";\n }\n return \"left\";\n}\nfunction positionForEvent(event) {\n const targetElement = event.target;\n if (targetElement.nodeName !== \"CANVAS\")\n return;\n return {\n x: event.offsetX,\n y: event.offsetY\n };\n}\nfunction consumeEvent(e) {\n e.preventDefault();\n e.stopPropagation();\n e.stopImmediatePropagation();\n}\nfunction asCheckbox(node) {\n if (!node || node.nodeName !== \"INPUT\")\n return null;\n const inputElement = node;\n return [\"checkbox\", \"radio\"].includes(inputElement.type) ? inputElement : null;\n}\nfunction isRangeInput(node) {\n if (!node || node.nodeName !== \"INPUT\")\n return false;\n const inputElement = node;\n return inputElement.type.toLowerCase() === \"range\";\n}\nfunction addEventListener(target, eventName, listener, useCapture) {\n target.addEventListener(eventName, listener, useCapture);\n const remove = () => {\n target.removeEventListener(eventName, listener, useCapture);\n };\n return remove;\n}\nfunction removeEventListeners(listeners) {\n for (const listener of listeners)\n listener();\n listeners.splice(0, listeners.length);\n}\nfunction querySelector(injectedScript, selector, ownerDocument) {\n try {\n const parsedSelector = injectedScript.parseSelector(selector);\n return {\n selector,\n elements: injectedScript.querySelectorAll(parsedSelector, ownerDocument)\n };\n } catch (e) {\n return {\n selector,\n elements: []\n };\n }\n}\nfunction createSvgElement(doc, { tagName, attrs, children }) {\n const elem = doc.createElementNS(\"http://www.w3.org/2000/svg\", tagName);\n if (attrs) {\n for (const [k, v] of Object.entries(attrs))\n elem.setAttribute(k, v);\n }\n if (children) {\n for (const c of children)\n elem.appendChild(createSvgElement(doc, c));\n }\n return elem;\n}\nvar PollingRecorder = class {\n constructor(injectedScript) {\n this._recorder = new Recorder(injectedScript);\n this._embedder = injectedScript.window;\n injectedScript.onGlobalListenersRemoved.add(() => this._recorder.installListeners());\n const refreshOverlay = () => {\n this._pollRecorderMode().catch((e) => console.log(e));\n };\n this._embedder.__pw_refreshOverlay = refreshOverlay;\n refreshOverlay();\n }\n async _pollRecorderMode() {\n const pollPeriod = 1e3;\n if (this._pollRecorderModeTimer)\n clearTimeout(this._pollRecorderModeTimer);\n const state = await this._embedder.__pw_recorderState().catch(() => {\n });\n if (!state) {\n this._pollRecorderModeTimer = this._recorder.injectedScript.builtinSetTimeout(() => this._pollRecorderMode(), pollPeriod);\n return;\n }\n const win = this._recorder.document.defaultView;\n if (win.top !== win) {\n state.actionPoint = void 0;\n }\n this._recorder.setUIState(state, this);\n this._pollRecorderModeTimer = this._recorder.injectedScript.builtinSetTimeout(() => this._pollRecorderMode(), pollPeriod);\n }\n async performAction(action, simpleDomNode) {\n await this._embedder.__pw_recorderPerformAction(action, simpleDomNode);\n }\n async recordAction(action, simpleDomNode) {\n await this._embedder.__pw_recorderRecordAction(action, simpleDomNode);\n }\n async setSelector(selector) {\n await this._embedder.__pw_recorderSetSelector(selector);\n }\n async setMode(mode) {\n await this._embedder.__pw_recorderSetMode(mode);\n }\n async setOverlayState(state) {\n await this._embedder.__pw_recorderSetOverlayState(state);\n }\n};\nvar recorder_default = PollingRecorder;\n";
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.blendWithWhite = blendWithWhite;
|
|
7
|
-
exports.colorDeltaE94 = colorDeltaE94;
|
|
8
|
-
exports.rgb2gray = rgb2gray;
|
|
9
|
-
exports.srgb2xyz = srgb2xyz;
|
|
10
|
-
exports.xyz2lab = xyz2lab;
|
|
11
|
-
/**
|
|
12
|
-
* Copyright (c) Microsoft Corporation.
|
|
13
|
-
*
|
|
14
|
-
* Licensed under the Apache License, Version 2.0 (the 'License");
|
|
15
|
-
* you may not use this file except in compliance with the License.
|
|
16
|
-
* You may obtain a copy of the License at
|
|
17
|
-
*
|
|
18
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
19
|
-
*
|
|
20
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
21
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
22
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
23
|
-
* See the License for the specific language governing permissions and
|
|
24
|
-
* limitations under the License.
|
|
25
|
-
*/
|
|
26
|
-
|
|
27
|
-
function blendWithWhite(c, a) {
|
|
28
|
-
return 255 + (c - 255) * a;
|
|
29
|
-
}
|
|
30
|
-
function rgb2gray(r, g, b) {
|
|
31
|
-
// NOTE: this is the exact integer formula from SSIM.js.
|
|
32
|
-
// See https://github.com/obartra/ssim/blob/ca8e3c6a6ff5f4f2e232239e0c3d91806f3c97d5/src/matlab/rgb2gray.ts#L56
|
|
33
|
-
return 77 * r + 150 * g + 29 * b + 128 >> 8;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
// Perceived color difference defined by CIE94.
|
|
37
|
-
// See https://en.wikipedia.org/wiki/Color_difference#CIE94
|
|
38
|
-
//
|
|
39
|
-
// The result of 1.0 is a "just-noticeable difference".
|
|
40
|
-
//
|
|
41
|
-
// Other results interpretation (taken from http://zschuessler.github.io/DeltaE/learn/):
|
|
42
|
-
// < 1.0 Not perceptible by human eyes.
|
|
43
|
-
// 1-2 Perceptible through close observation.
|
|
44
|
-
// 2-10 Perceptible at a glance.
|
|
45
|
-
// 11-49 Colors are more similar than opposite
|
|
46
|
-
// 100 Colors are exact opposite
|
|
47
|
-
function colorDeltaE94(rgb1, rgb2) {
|
|
48
|
-
const [l1, a1, b1] = xyz2lab(srgb2xyz(rgb1));
|
|
49
|
-
const [l2, a2, b2] = xyz2lab(srgb2xyz(rgb2));
|
|
50
|
-
const deltaL = l1 - l2;
|
|
51
|
-
const deltaA = a1 - a2;
|
|
52
|
-
const deltaB = b1 - b2;
|
|
53
|
-
const c1 = Math.sqrt(a1 ** 2 + b1 ** 2);
|
|
54
|
-
const c2 = Math.sqrt(a2 ** 2 + b2 ** 2);
|
|
55
|
-
const deltaC = c1 - c2;
|
|
56
|
-
let deltaH = deltaA ** 2 + deltaB ** 2 - deltaC ** 2;
|
|
57
|
-
deltaH = deltaH < 0 ? 0 : Math.sqrt(deltaH);
|
|
58
|
-
// The k1, k2, kL, kC, kH values for "graphic arts" applications.
|
|
59
|
-
// See https://en.wikipedia.org/wiki/Color_difference#CIE94
|
|
60
|
-
const k1 = 0.045;
|
|
61
|
-
const k2 = 0.015;
|
|
62
|
-
const kL = 1;
|
|
63
|
-
const kC = 1;
|
|
64
|
-
const kH = 1;
|
|
65
|
-
const sC = 1.0 + k1 * c1;
|
|
66
|
-
const sH = 1.0 + k2 * c1;
|
|
67
|
-
const sL = 1;
|
|
68
|
-
return Math.sqrt((deltaL / sL / kL) ** 2 + (deltaC / sC / kC) ** 2 + (deltaH / sH / kH) ** 2);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
// sRGB -> 1-normalized XYZ (i.e. Y ∈ [0, 1]) with D65 illuminant
|
|
72
|
-
// See https://en.wikipedia.org/wiki/SRGB#From_sRGB_to_CIE_XYZ
|
|
73
|
-
function srgb2xyz(rgb) {
|
|
74
|
-
let r = rgb[0] / 255;
|
|
75
|
-
let g = rgb[1] / 255;
|
|
76
|
-
let b = rgb[2] / 255;
|
|
77
|
-
r = r > 0.04045 ? Math.pow((r + 0.055) / 1.055, 2.4) : r / 12.92;
|
|
78
|
-
g = g > 0.04045 ? Math.pow((g + 0.055) / 1.055, 2.4) : g / 12.92;
|
|
79
|
-
b = b > 0.04045 ? Math.pow((b + 0.055) / 1.055, 2.4) : b / 12.92;
|
|
80
|
-
return [r * 0.4124 + g * 0.3576 + b * 0.1805, r * 0.2126 + g * 0.7152 + b * 0.0722, r * 0.0193 + g * 0.1192 + b * 0.9505];
|
|
81
|
-
}
|
|
82
|
-
const sigma_pow2 = 6 * 6 / 29 / 29;
|
|
83
|
-
const sigma_pow3 = 6 * 6 * 6 / 29 / 29 / 29;
|
|
84
|
-
|
|
85
|
-
// 1-normalized CIE XYZ with D65 to L*a*b*
|
|
86
|
-
// See https://en.wikipedia.org/wiki/CIELAB_color_space#From_CIEXYZ_to_CIELAB
|
|
87
|
-
function xyz2lab(xyz) {
|
|
88
|
-
const x = xyz[0] / 0.950489;
|
|
89
|
-
const y = xyz[1];
|
|
90
|
-
const z = xyz[2] / 1.088840;
|
|
91
|
-
const fx = x > sigma_pow3 ? x ** (1 / 3) : x / 3 / sigma_pow2 + 4 / 29;
|
|
92
|
-
const fy = y > sigma_pow3 ? y ** (1 / 3) : y / 3 / sigma_pow2 + 4 / 29;
|
|
93
|
-
const fz = z > sigma_pow3 ? z ** (1 / 3) : z / 3 / sigma_pow2 + 4 / 29;
|
|
94
|
-
const l = 116 * fy - 16;
|
|
95
|
-
const a = 500 * (fx - fy);
|
|
96
|
-
const b = 200 * (fy - fz);
|
|
97
|
-
return [l, a, b];
|
|
98
|
-
}
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.compare = compare;
|
|
7
|
-
var _colorUtils = require("./colorUtils");
|
|
8
|
-
var _imageChannel = require("./imageChannel");
|
|
9
|
-
var _stats = require("./stats");
|
|
10
|
-
/**
|
|
11
|
-
* Copyright (c) Microsoft Corporation.
|
|
12
|
-
*
|
|
13
|
-
* Licensed under the Apache License, Version 2.0 (the 'License");
|
|
14
|
-
* you may not use this file except in compliance with the License.
|
|
15
|
-
* You may obtain a copy of the License at
|
|
16
|
-
*
|
|
17
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
18
|
-
*
|
|
19
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
20
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
21
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
22
|
-
* See the License for the specific language governing permissions and
|
|
23
|
-
* limitations under the License.
|
|
24
|
-
*/
|
|
25
|
-
|
|
26
|
-
const SSIM_WINDOW_RADIUS = 15;
|
|
27
|
-
const VARIANCE_WINDOW_RADIUS = 1;
|
|
28
|
-
function drawPixel(width, data, x, y, r, g, b) {
|
|
29
|
-
const idx = (y * width + x) * 4;
|
|
30
|
-
data[idx + 0] = r;
|
|
31
|
-
data[idx + 1] = g;
|
|
32
|
-
data[idx + 2] = b;
|
|
33
|
-
data[idx + 3] = 255;
|
|
34
|
-
}
|
|
35
|
-
function compare(actual, expected, diff, width, height, options = {}) {
|
|
36
|
-
const {
|
|
37
|
-
maxColorDeltaE94 = 1.0
|
|
38
|
-
} = options;
|
|
39
|
-
const paddingSize = Math.max(VARIANCE_WINDOW_RADIUS, SSIM_WINDOW_RADIUS);
|
|
40
|
-
const paddingColorEven = [255, 0, 255];
|
|
41
|
-
const paddingColorOdd = [0, 255, 0];
|
|
42
|
-
const [r1, g1, b1] = _imageChannel.ImageChannel.intoRGB(width, height, expected, {
|
|
43
|
-
paddingSize,
|
|
44
|
-
paddingColorEven,
|
|
45
|
-
paddingColorOdd
|
|
46
|
-
});
|
|
47
|
-
const [r2, g2, b2] = _imageChannel.ImageChannel.intoRGB(width, height, actual, {
|
|
48
|
-
paddingSize,
|
|
49
|
-
paddingColorEven,
|
|
50
|
-
paddingColorOdd
|
|
51
|
-
});
|
|
52
|
-
const noop = (x, y) => {};
|
|
53
|
-
const drawRedPixel = diff ? (x, y) => drawPixel(width, diff, x - paddingSize, y - paddingSize, 255, 0, 0) : noop;
|
|
54
|
-
const drawYellowPixel = diff ? (x, y) => drawPixel(width, diff, x - paddingSize, y - paddingSize, 255, 255, 0) : noop;
|
|
55
|
-
const drawGrayPixel = diff ? (x, y) => {
|
|
56
|
-
const gray = (0, _colorUtils.rgb2gray)(r1.get(x, y), g1.get(x, y), b1.get(x, y));
|
|
57
|
-
const value = (0, _colorUtils.blendWithWhite)(gray, 0.1);
|
|
58
|
-
drawPixel(width, diff, x - paddingSize, y - paddingSize, value, value, value);
|
|
59
|
-
} : noop;
|
|
60
|
-
let fastR, fastG, fastB;
|
|
61
|
-
let diffCount = 0;
|
|
62
|
-
for (let y = paddingSize; y < r1.height - paddingSize; ++y) {
|
|
63
|
-
for (let x = paddingSize; x < r1.width - paddingSize; ++x) {
|
|
64
|
-
// Fast-path: equal pixels.
|
|
65
|
-
if (r1.get(x, y) === r2.get(x, y) && g1.get(x, y) === g2.get(x, y) && b1.get(x, y) === b2.get(x, y)) {
|
|
66
|
-
drawGrayPixel(x, y);
|
|
67
|
-
continue;
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
// Compare pixel colors using the dE94 color difference formulae.
|
|
71
|
-
// The dE94 is normalized so that the value of 1.0 is the "just-noticeable-difference".
|
|
72
|
-
// Color difference below 1.0 is not noticeable to a human eye, so we can disregard it.
|
|
73
|
-
// See https://en.wikipedia.org/wiki/Color_difference
|
|
74
|
-
const delta = (0, _colorUtils.colorDeltaE94)([r1.get(x, y), g1.get(x, y), b1.get(x, y)], [r2.get(x, y), g2.get(x, y), b2.get(x, y)]);
|
|
75
|
-
if (delta <= maxColorDeltaE94) {
|
|
76
|
-
drawGrayPixel(x, y);
|
|
77
|
-
continue;
|
|
78
|
-
}
|
|
79
|
-
if (!fastR || !fastG || !fastB) {
|
|
80
|
-
fastR = new _stats.FastStats(r1, r2);
|
|
81
|
-
fastG = new _stats.FastStats(g1, g2);
|
|
82
|
-
fastB = new _stats.FastStats(b1, b2);
|
|
83
|
-
}
|
|
84
|
-
const [varX1, varY1] = r1.boundXY(x - VARIANCE_WINDOW_RADIUS, y - VARIANCE_WINDOW_RADIUS);
|
|
85
|
-
const [varX2, varY2] = r1.boundXY(x + VARIANCE_WINDOW_RADIUS, y + VARIANCE_WINDOW_RADIUS);
|
|
86
|
-
const var1 = fastR.varianceC1(varX1, varY1, varX2, varY2) + fastG.varianceC1(varX1, varY1, varX2, varY2) + fastB.varianceC1(varX1, varY1, varX2, varY2);
|
|
87
|
-
const var2 = fastR.varianceC2(varX1, varY1, varX2, varY2) + fastG.varianceC2(varX1, varY1, varX2, varY2) + fastB.varianceC2(varX1, varY1, varX2, varY2);
|
|
88
|
-
// if this pixel is a part of a flood fill of a 3x3 square of either of the images, then it cannot be
|
|
89
|
-
// anti-aliasing pixel so it must be a pixel difference.
|
|
90
|
-
if (var1 === 0 || var2 === 0) {
|
|
91
|
-
drawRedPixel(x, y);
|
|
92
|
-
++diffCount;
|
|
93
|
-
continue;
|
|
94
|
-
}
|
|
95
|
-
const [ssimX1, ssimY1] = r1.boundXY(x - SSIM_WINDOW_RADIUS, y - SSIM_WINDOW_RADIUS);
|
|
96
|
-
const [ssimX2, ssimY2] = r1.boundXY(x + SSIM_WINDOW_RADIUS, y + SSIM_WINDOW_RADIUS);
|
|
97
|
-
const ssimRGB = ((0, _stats.ssim)(fastR, ssimX1, ssimY1, ssimX2, ssimY2) + (0, _stats.ssim)(fastG, ssimX1, ssimY1, ssimX2, ssimY2) + (0, _stats.ssim)(fastB, ssimX1, ssimY1, ssimX2, ssimY2)) / 3.0;
|
|
98
|
-
const isAntialiased = ssimRGB >= 0.99;
|
|
99
|
-
if (isAntialiased) {
|
|
100
|
-
drawYellowPixel(x, y);
|
|
101
|
-
} else {
|
|
102
|
-
drawRedPixel(x, y);
|
|
103
|
-
++diffCount;
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
return diffCount;
|
|
108
|
-
}
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.ImageChannel = void 0;
|
|
7
|
-
var _colorUtils = require("./colorUtils");
|
|
8
|
-
/**
|
|
9
|
-
* Copyright (c) Microsoft Corporation.
|
|
10
|
-
*
|
|
11
|
-
* Licensed under the Apache License, Version 2.0 (the 'License");
|
|
12
|
-
* you may not use this file except in compliance with the License.
|
|
13
|
-
* You may obtain a copy of the License at
|
|
14
|
-
*
|
|
15
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
16
|
-
*
|
|
17
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
18
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
19
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
20
|
-
* See the License for the specific language governing permissions and
|
|
21
|
-
* limitations under the License.
|
|
22
|
-
*/
|
|
23
|
-
|
|
24
|
-
class ImageChannel {
|
|
25
|
-
static intoRGB(width, height, data, options = {}) {
|
|
26
|
-
const {
|
|
27
|
-
paddingSize = 0,
|
|
28
|
-
paddingColorOdd = [255, 0, 255],
|
|
29
|
-
paddingColorEven = [0, 255, 0]
|
|
30
|
-
} = options;
|
|
31
|
-
const newWidth = width + 2 * paddingSize;
|
|
32
|
-
const newHeight = height + 2 * paddingSize;
|
|
33
|
-
const r = new Uint8Array(newWidth * newHeight);
|
|
34
|
-
const g = new Uint8Array(newWidth * newHeight);
|
|
35
|
-
const b = new Uint8Array(newWidth * newHeight);
|
|
36
|
-
for (let y = 0; y < newHeight; ++y) {
|
|
37
|
-
for (let x = 0; x < newWidth; ++x) {
|
|
38
|
-
const index = y * newWidth + x;
|
|
39
|
-
if (y >= paddingSize && y < newHeight - paddingSize && x >= paddingSize && x < newWidth - paddingSize) {
|
|
40
|
-
const offset = ((y - paddingSize) * width + (x - paddingSize)) * 4;
|
|
41
|
-
const alpha = data[offset + 3] === 255 ? 1 : data[offset + 3] / 255;
|
|
42
|
-
r[index] = (0, _colorUtils.blendWithWhite)(data[offset], alpha);
|
|
43
|
-
g[index] = (0, _colorUtils.blendWithWhite)(data[offset + 1], alpha);
|
|
44
|
-
b[index] = (0, _colorUtils.blendWithWhite)(data[offset + 2], alpha);
|
|
45
|
-
} else {
|
|
46
|
-
const color = (y + x) % 2 === 0 ? paddingColorEven : paddingColorOdd;
|
|
47
|
-
r[index] = color[0];
|
|
48
|
-
g[index] = color[1];
|
|
49
|
-
b[index] = color[2];
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
return [new ImageChannel(newWidth, newHeight, r), new ImageChannel(newWidth, newHeight, g), new ImageChannel(newWidth, newHeight, b)];
|
|
54
|
-
}
|
|
55
|
-
constructor(width, height, data) {
|
|
56
|
-
this.data = void 0;
|
|
57
|
-
this.width = void 0;
|
|
58
|
-
this.height = void 0;
|
|
59
|
-
this.data = data;
|
|
60
|
-
this.width = width;
|
|
61
|
-
this.height = height;
|
|
62
|
-
}
|
|
63
|
-
get(x, y) {
|
|
64
|
-
return this.data[y * this.width + x];
|
|
65
|
-
}
|
|
66
|
-
boundXY(x, y) {
|
|
67
|
-
return [Math.min(Math.max(x, 0), this.width - 1), Math.min(Math.max(y, 0), this.height - 1)];
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
exports.ImageChannel = ImageChannel;
|
package/lib/image_tools/stats.js
DELETED
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.FastStats = void 0;
|
|
7
|
-
exports.ssim = ssim;
|
|
8
|
-
/**
|
|
9
|
-
* Copyright (c) Microsoft Corporation.
|
|
10
|
-
*
|
|
11
|
-
* Licensed under the Apache License, Version 2.0 (the 'License");
|
|
12
|
-
* you may not use this file except in compliance with the License.
|
|
13
|
-
* You may obtain a copy of the License at
|
|
14
|
-
*
|
|
15
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
16
|
-
*
|
|
17
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
18
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
19
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
20
|
-
* See the License for the specific language governing permissions and
|
|
21
|
-
* limitations under the License.
|
|
22
|
-
*/
|
|
23
|
-
|
|
24
|
-
// Image channel has a 8-bit depth.
|
|
25
|
-
const DYNAMIC_RANGE = 2 ** 8 - 1;
|
|
26
|
-
function ssim(stats, x1, y1, x2, y2) {
|
|
27
|
-
const mean1 = stats.meanC1(x1, y1, x2, y2);
|
|
28
|
-
const mean2 = stats.meanC2(x1, y1, x2, y2);
|
|
29
|
-
const var1 = stats.varianceC1(x1, y1, x2, y2);
|
|
30
|
-
const var2 = stats.varianceC2(x1, y1, x2, y2);
|
|
31
|
-
const cov = stats.covariance(x1, y1, x2, y2);
|
|
32
|
-
const c1 = (0.01 * DYNAMIC_RANGE) ** 2;
|
|
33
|
-
const c2 = (0.03 * DYNAMIC_RANGE) ** 2;
|
|
34
|
-
return (2 * mean1 * mean2 + c1) * (2 * cov + c2) / (mean1 ** 2 + mean2 ** 2 + c1) / (var1 + var2 + c2);
|
|
35
|
-
}
|
|
36
|
-
class FastStats {
|
|
37
|
-
constructor(c1, c2) {
|
|
38
|
-
this.c1 = void 0;
|
|
39
|
-
this.c2 = void 0;
|
|
40
|
-
this._partialSumC1 = void 0;
|
|
41
|
-
this._partialSumC2 = void 0;
|
|
42
|
-
this._partialSumMult = void 0;
|
|
43
|
-
this._partialSumSq1 = void 0;
|
|
44
|
-
this._partialSumSq2 = void 0;
|
|
45
|
-
this.c1 = c1;
|
|
46
|
-
this.c2 = c2;
|
|
47
|
-
const {
|
|
48
|
-
width,
|
|
49
|
-
height
|
|
50
|
-
} = c1;
|
|
51
|
-
this._partialSumC1 = new Array(width * height);
|
|
52
|
-
this._partialSumC2 = new Array(width * height);
|
|
53
|
-
this._partialSumSq1 = new Array(width * height);
|
|
54
|
-
this._partialSumSq2 = new Array(width * height);
|
|
55
|
-
this._partialSumMult = new Array(width * height);
|
|
56
|
-
const recalc = (mx, idx, initial, x, y) => {
|
|
57
|
-
mx[idx] = initial;
|
|
58
|
-
if (y > 0) mx[idx] += mx[(y - 1) * width + x];
|
|
59
|
-
if (x > 0) mx[idx] += mx[y * width + x - 1];
|
|
60
|
-
if (x > 0 && y > 0) mx[idx] -= mx[(y - 1) * width + x - 1];
|
|
61
|
-
};
|
|
62
|
-
for (let y = 0; y < height; ++y) {
|
|
63
|
-
for (let x = 0; x < width; ++x) {
|
|
64
|
-
const idx = y * width + x;
|
|
65
|
-
recalc(this._partialSumC1, idx, this.c1.data[idx], x, y);
|
|
66
|
-
recalc(this._partialSumC2, idx, this.c2.data[idx], x, y);
|
|
67
|
-
recalc(this._partialSumSq1, idx, this.c1.data[idx] * this.c1.data[idx], x, y);
|
|
68
|
-
recalc(this._partialSumSq2, idx, this.c2.data[idx] * this.c2.data[idx], x, y);
|
|
69
|
-
recalc(this._partialSumMult, idx, this.c1.data[idx] * this.c2.data[idx], x, y);
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
_sum(partialSum, x1, y1, x2, y2) {
|
|
74
|
-
const width = this.c1.width;
|
|
75
|
-
let result = partialSum[y2 * width + x2];
|
|
76
|
-
if (y1 > 0) result -= partialSum[(y1 - 1) * width + x2];
|
|
77
|
-
if (x1 > 0) result -= partialSum[y2 * width + x1 - 1];
|
|
78
|
-
if (x1 > 0 && y1 > 0) result += partialSum[(y1 - 1) * width + x1 - 1];
|
|
79
|
-
return result;
|
|
80
|
-
}
|
|
81
|
-
meanC1(x1, y1, x2, y2) {
|
|
82
|
-
const N = (y2 - y1 + 1) * (x2 - x1 + 1);
|
|
83
|
-
return this._sum(this._partialSumC1, x1, y1, x2, y2) / N;
|
|
84
|
-
}
|
|
85
|
-
meanC2(x1, y1, x2, y2) {
|
|
86
|
-
const N = (y2 - y1 + 1) * (x2 - x1 + 1);
|
|
87
|
-
return this._sum(this._partialSumC2, x1, y1, x2, y2) / N;
|
|
88
|
-
}
|
|
89
|
-
varianceC1(x1, y1, x2, y2) {
|
|
90
|
-
const N = (y2 - y1 + 1) * (x2 - x1 + 1);
|
|
91
|
-
return (this._sum(this._partialSumSq1, x1, y1, x2, y2) - this._sum(this._partialSumC1, x1, y1, x2, y2) ** 2 / N) / N;
|
|
92
|
-
}
|
|
93
|
-
varianceC2(x1, y1, x2, y2) {
|
|
94
|
-
const N = (y2 - y1 + 1) * (x2 - x1 + 1);
|
|
95
|
-
return (this._sum(this._partialSumSq2, x1, y1, x2, y2) - this._sum(this._partialSumC2, x1, y1, x2, y2) ** 2 / N) / N;
|
|
96
|
-
}
|
|
97
|
-
covariance(x1, y1, x2, y2) {
|
|
98
|
-
const N = (y2 - y1 + 1) * (x2 - x1 + 1);
|
|
99
|
-
return (this._sum(this._partialSumMult, x1, y1, x2, y2) - this._sum(this._partialSumC1, x1, y1, x2, y2) * this._sum(this._partialSumC2, x1, y1, x2, y2) / N) / N;
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
exports.FastStats = FastStats;
|
|
@@ -1,82 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.PipeTransport = void 0;
|
|
7
|
-
var _utils = require("../utils");
|
|
8
|
-
/**
|
|
9
|
-
* Copyright (c) Microsoft Corporation.
|
|
10
|
-
*
|
|
11
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
12
|
-
* you may not use this file except in compliance with the License.
|
|
13
|
-
* You may obtain a copy of the License at
|
|
14
|
-
*
|
|
15
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
16
|
-
*
|
|
17
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
18
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
19
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
20
|
-
* See the License for the specific language governing permissions and
|
|
21
|
-
* limitations under the License.
|
|
22
|
-
*/
|
|
23
|
-
|
|
24
|
-
class PipeTransport {
|
|
25
|
-
constructor(pipeWrite, pipeRead, closeable, endian = 'le') {
|
|
26
|
-
this._pipeWrite = void 0;
|
|
27
|
-
this._data = Buffer.from([]);
|
|
28
|
-
this._waitForNextTask = (0, _utils.makeWaitForNextTask)();
|
|
29
|
-
this._closed = false;
|
|
30
|
-
this._bytesLeft = 0;
|
|
31
|
-
this.onmessage = void 0;
|
|
32
|
-
this.onclose = void 0;
|
|
33
|
-
this._endian = void 0;
|
|
34
|
-
this._closeableStream = void 0;
|
|
35
|
-
this._pipeWrite = pipeWrite;
|
|
36
|
-
this._endian = endian;
|
|
37
|
-
this._closeableStream = closeable;
|
|
38
|
-
pipeRead.on('data', buffer => this._dispatch(buffer));
|
|
39
|
-
pipeRead.on('close', () => {
|
|
40
|
-
this._closed = true;
|
|
41
|
-
if (this.onclose) this.onclose();
|
|
42
|
-
});
|
|
43
|
-
this.onmessage = undefined;
|
|
44
|
-
this.onclose = undefined;
|
|
45
|
-
}
|
|
46
|
-
send(message) {
|
|
47
|
-
if (this._closed) throw new Error('Pipe has been closed');
|
|
48
|
-
const data = Buffer.from(message, 'utf-8');
|
|
49
|
-
const dataLength = Buffer.alloc(4);
|
|
50
|
-
if (this._endian === 'be') dataLength.writeUInt32BE(data.length, 0);else dataLength.writeUInt32LE(data.length, 0);
|
|
51
|
-
this._pipeWrite.write(dataLength);
|
|
52
|
-
this._pipeWrite.write(data);
|
|
53
|
-
}
|
|
54
|
-
close() {
|
|
55
|
-
// Let it throw.
|
|
56
|
-
this._closeableStream.close();
|
|
57
|
-
}
|
|
58
|
-
_dispatch(buffer) {
|
|
59
|
-
this._data = Buffer.concat([this._data, buffer]);
|
|
60
|
-
while (true) {
|
|
61
|
-
if (!this._bytesLeft && this._data.length < 4) {
|
|
62
|
-
// Need more data.
|
|
63
|
-
break;
|
|
64
|
-
}
|
|
65
|
-
if (!this._bytesLeft) {
|
|
66
|
-
this._bytesLeft = this._endian === 'be' ? this._data.readUInt32BE(0) : this._data.readUInt32LE(0);
|
|
67
|
-
this._data = this._data.slice(4);
|
|
68
|
-
}
|
|
69
|
-
if (!this._bytesLeft || this._data.length < this._bytesLeft) {
|
|
70
|
-
// Need more data.
|
|
71
|
-
break;
|
|
72
|
-
}
|
|
73
|
-
const message = this._data.slice(0, this._bytesLeft);
|
|
74
|
-
this._data = this._data.slice(this._bytesLeft);
|
|
75
|
-
this._bytesLeft = 0;
|
|
76
|
-
this._waitForNextTask(() => {
|
|
77
|
-
if (this.onmessage) this.onmessage(message.toString('utf-8'));
|
|
78
|
-
});
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
exports.PipeTransport = PipeTransport;
|