From d93e9a7d8a62dfa6b6a9bc2c1f19e0401dae0e33 Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Fri, 30 Jul 2021 15:04:05 -0400 Subject: [PATCH 01/29] Add basic selenium test --- .eslintrc.js | 2 + jest.config.js | 2 +- package-lock.json | 432 +++++++++++++++++++++++++++++++++++------- package.json | 3 + test/selenium.test.ts | 44 +++++ 5 files changed, 417 insertions(+), 66 deletions(-) create mode 100644 test/selenium.test.ts diff --git a/.eslintrc.js b/.eslintrc.js index 64b64a12..b6264a34 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -3,6 +3,8 @@ module.exports = { browser: true, es2021: true, node: true, + jest: true, + jasmine: true, }, extends: [ "eslint:recommended", diff --git a/jest.config.js b/jest.config.js index 641bafac..a1ba3f09 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,6 +1,6 @@ module.exports = { "roots": [ - "src" + "test" ], "transform": { "^.+\\.ts$": "ts-jest" diff --git a/package-lock.json b/package-lock.json index ef9f579b..f4d3c9aa 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,7 @@ "dependencies": { "@types/react": "^16.9.22", "@types/react-dom": "^16.9.5", + "@types/selenium-webdriver": "^4.0.15", "babel": "^6.23.0", "babel-core": "^6.26.3", "babel-loader": "^8.0.6", @@ -26,11 +27,13 @@ "@types/jquery": "^3.3.31", "@typescript-eslint/eslint-plugin": "^4.9.1", "@typescript-eslint/parser": "^4.9.1", + "chromedriver": "^92.0.0", "copy-webpack-plugin": "^6.0.3", "eslint": "^7.15.0", "eslint-plugin-react": "^7.21.5", "jest": "^27.0.6", "rimraf": "^3.0.0", + "selenium-webdriver": "^4.0.0-beta.4", "ts-jest": "^27.0.3", "ts-loader": "^6.2.1", "typescript": "~4.3", @@ -1997,6 +2000,12 @@ "node": ">=6" } }, + "node_modules/@testim/chrome-version": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/@testim/chrome-version/-/chrome-version-1.0.7.tgz", + "integrity": "sha512-8UT/J+xqCYfn3fKtOznAibsHpiuDshCb0fwgWxRazTT19Igp9ovoXMPhXyLD6m3CKQGTMHgqoxaFfMWaL40Rnw==", + "dev": true + }, "node_modules/@tootallnate/once": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz", @@ -2207,6 +2216,11 @@ "@types/react": "*" } }, + "node_modules/@types/selenium-webdriver": { + "version": "4.0.15", + "resolved": "https://registry.npmjs.org/@types/selenium-webdriver/-/selenium-webdriver-4.0.15.tgz", + "integrity": "sha512-5760PIZkzhPejy3hsKAdCKe5LJygGdxLKOLxmZL9GEUcFlO5OgzM6G2EbdbvOnaw4xvUSa9Uip6Ipwkih12BPA==" + }, "node_modules/@types/sizzle": { "version": "2.3.2", "resolved": "https://registry.npmjs.org/@types/sizzle/-/sizzle-2.3.2.tgz", @@ -3536,6 +3550,15 @@ "integrity": "sha512-zg7Hz2k5lI8kb7U32998pRRFin7zJlkfezGJjUc2heaD4Pw2wObakCDVzkKztTm/Ln7eiVvYsjqak0Ed4LkMDA==", "dev": true }, + "node_modules/axios": { + "version": "0.21.1", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz", + "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==", + "dev": true, + "dependencies": { + "follow-redirects": "^1.10.0" + } + }, "node_modules/babel": { "version": "6.23.0", "resolved": "https://registry.npmjs.org/babel/-/babel-6.23.0.tgz", @@ -5387,6 +5410,28 @@ "node": ">=6.0" } }, + "node_modules/chromedriver": { + "version": "92.0.0", + "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-92.0.0.tgz", + "integrity": "sha512-IdJ5n5jLL6tCsGQF/fQHF2gDEhVzoYIqktUn6hE/BSsXlCcyDTi45fQbhTEhZlmshM8+BpnRtPuIT5DRbxNqKg==", + "dev": true, + "hasInstallScript": true, + "dependencies": { + "@testim/chrome-version": "^1.0.7", + "axios": "^0.21.1", + "del": "^6.0.0", + "extract-zip": "^2.0.1", + "https-proxy-agent": "^5.0.0", + "proxy-from-env": "^1.1.0", + "tcp-port-used": "^1.0.1" + }, + "bin": { + "chromedriver": "bin/chromedriver" + }, + "engines": { + "node": ">=10" + } + }, "node_modules/ci-info": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz", @@ -6148,21 +6193,6 @@ "node": ">=8" } }, - "node_modules/copy-webpack-plugin/node_modules/rimraf": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", - "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", - "dev": true, - "dependencies": { - "glob": "^7.1.3" - }, - "bin": { - "rimraf": "bin.js" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, "node_modules/copy-webpack-plugin/node_modules/schema-utils": { "version": "2.7.0", "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz", @@ -6397,12 +6427,19 @@ "dev": true }, "node_modules/debug": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", - "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", - "deprecated": "Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)", + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz", + "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==", "dependencies": { - "ms": "^2.1.1" + "ms": "2.1.2" + }, + "engines": { + "node": ">=6.0" + }, + "peerDependenciesMeta": { + "supports-color": { + "optional": true + } } }, "node_modules/decamelize": { @@ -6749,6 +6786,37 @@ "node": ">=0.10.0" } }, + "node_modules/del": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/del/-/del-6.0.0.tgz", + "integrity": "sha512-1shh9DQ23L16oXSZKB2JxpL7iMy2E0S9d517ptA1P8iw0alkPtQcrKH7ru31rYtKwF499HkTu+DRzq3TCKDFRQ==", + "dev": true, + "dependencies": { + "globby": "^11.0.1", + "graceful-fs": "^4.2.4", + "is-glob": "^4.0.1", + "is-path-cwd": "^2.2.0", + "is-path-inside": "^3.0.2", + "p-map": "^4.0.0", + "rimraf": "^3.0.2", + "slash": "^3.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/del/node_modules/slash": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz", + "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", + "dev": true, + "engines": { + "node": ">=8" + } + }, "node_modules/delayed-stream": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", @@ -8302,6 +8370,41 @@ "node": ">=0.10.0" } }, + "node_modules/extract-zip": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-2.0.1.tgz", + "integrity": "sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==", + "dev": true, + "dependencies": { + "debug": "^4.1.1", + "get-stream": "^5.1.0", + "yauzl": "^2.10.0" + }, + "bin": { + "extract-zip": "cli.js" + }, + "engines": { + "node": ">= 10.17.0" + }, + "optionalDependencies": { + "@types/yauzl": "^2.9.1" + } + }, + "node_modules/extract-zip/node_modules/get-stream": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz", + "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==", + "dev": true, + "dependencies": { + "pump": "^3.0.0" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/extsprintf": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz", @@ -8691,21 +8794,6 @@ "node": "^10.12.0 || >=12.0.0" } }, - "node_modules/flat-cache/node_modules/rimraf": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", - "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", - "dev": true, - "dependencies": { - "glob": "^7.1.3" - }, - "bin": { - "rimraf": "bin.js" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, "node_modules/flatstr": { "version": "1.0.12", "resolved": "https://registry.npmjs.org/flatstr/-/flatstr-1.0.12.tgz", @@ -8736,6 +8824,26 @@ "readable-stream": "^2.3.6" } }, + "node_modules/follow-redirects": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.1.tgz", + "integrity": "sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==", + "dev": true, + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/RubenVerborgh" + } + ], + "engines": { + "node": ">=4.0" + }, + "peerDependenciesMeta": { + "debug": { + "optional": true + } + } + }, "node_modules/for-in": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz", @@ -9740,6 +9848,15 @@ "url": "https://github.com/sindresorhus/invert-kv?sponsor=1" } }, + "node_modules/ip-regex": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-4.3.0.tgz", + "integrity": "sha512-B9ZWJxHHOHUhUjCPrMpLD4xEq35bUTClHM1S6CBU5ixQnkZmwipwgc96vAd7AAGM9TGHvJR+Uss+/Ak6UphK+Q==", + "dev": true, + "engines": { + "node": ">=8" + } + }, "node_modules/ipaddr.js": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz", @@ -10078,6 +10195,15 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-path-cwd": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz", + "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==", + "dev": true, + "engines": { + "node": ">=6" + } + }, "node_modules/is-path-inside": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz", @@ -10190,6 +10316,12 @@ "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=", "dev": true }, + "node_modules/is-url": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz", + "integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==", + "dev": true + }, "node_modules/is-utf8": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz", @@ -10222,6 +10354,20 @@ "integrity": "sha512-VjSeb/lHmkoyd8ryPVIKvOCn4D1koMqY+vqyjjUfc3xyKtP4dYOxM44sZrnqQSzSds3xyOrUTLTC9LVCVgLngw==", "dev": true }, + "node_modules/is2": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/is2/-/is2-2.0.7.tgz", + "integrity": "sha512-4vBQoURAXC6hnLFxD4VW7uc04XiwTTl/8ydYJxKvPwkWQrSjInkuM5VZVg6BGr1/natq69zDuvO9lGpLClJqvA==", + "dev": true, + "dependencies": { + "deep-is": "^0.1.3", + "ip-regex": "^4.1.0", + "is-url": "^1.2.4" + }, + "engines": { + "node": ">=v0.10.0" + } + }, "node_modules/isarray": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", @@ -16690,6 +16836,12 @@ "node": ">= 0.10" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==", + "dev": true + }, "node_modules/prr": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz", @@ -17304,9 +17456,9 @@ } }, "node_modules/rimraf": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.1.tgz", - "integrity": "sha512-IQ4ikL8SjBiEDZfk+DFVwqRK8md24RWMEJkdSlgNLkyyAImcjf8SWvU1qFMDOb4igBClbTQ/ugPqXcRwdFTxZw==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", + "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", "dev": true, "dependencies": { "glob": "^7.1.3" @@ -17442,6 +17594,21 @@ "seek-table": "bin/seek-bzip-table" } }, + "node_modules/selenium-webdriver": { + "version": "4.0.0-beta.4", + "resolved": "https://registry.npmjs.org/selenium-webdriver/-/selenium-webdriver-4.0.0-beta.4.tgz", + "integrity": "sha512-+s/CIYkWzmnC9WASBxxVj7Lm0dcyl6OaFxwIJaFCT5WCuACiimEEr4lUnOOFP/QlKfkDQ56m+aRczaq2EvJEJg==", + "dev": true, + "dependencies": { + "jszip": "^3.6.0", + "rimraf": "^3.0.2", + "tmp": "^0.2.1", + "ws": ">=7.4.6" + }, + "engines": { + "node": ">= 10.15.0" + } + }, "node_modules/semver": { "version": "6.3.0", "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", @@ -18707,6 +18874,16 @@ "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", "dev": true }, + "node_modules/tcp-port-used": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/tcp-port-used/-/tcp-port-used-1.0.2.tgz", + "integrity": "sha512-l7ar8lLUD3XS1V2lfoJlCBaeoaWo/2xfYt81hM7VlvR4RrMVFqfmzfhLVk40hAb368uitje5gPtBRL1m/DGvLA==", + "dev": true, + "dependencies": { + "debug": "4.3.1", + "is2": "^2.0.6" + } + }, "node_modules/terminal-link": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/terminal-link/-/terminal-link-2.1.1.tgz", @@ -22200,6 +22377,12 @@ "defer-to-connect": "^1.0.1" } }, + "@testim/chrome-version": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/@testim/chrome-version/-/chrome-version-1.0.7.tgz", + "integrity": "sha512-8UT/J+xqCYfn3fKtOznAibsHpiuDshCb0fwgWxRazTT19Igp9ovoXMPhXyLD6m3CKQGTMHgqoxaFfMWaL40Rnw==", + "dev": true + }, "@tootallnate/once": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz", @@ -22407,6 +22590,11 @@ "@types/react": "*" } }, + "@types/selenium-webdriver": { + "version": "4.0.15", + "resolved": "https://registry.npmjs.org/@types/selenium-webdriver/-/selenium-webdriver-4.0.15.tgz", + "integrity": "sha512-5760PIZkzhPejy3hsKAdCKe5LJygGdxLKOLxmZL9GEUcFlO5OgzM6G2EbdbvOnaw4xvUSa9Uip6Ipwkih12BPA==" + }, "@types/sizzle": { "version": "2.3.2", "resolved": "https://registry.npmjs.org/@types/sizzle/-/sizzle-2.3.2.tgz", @@ -23442,6 +23630,15 @@ "integrity": "sha512-zg7Hz2k5lI8kb7U32998pRRFin7zJlkfezGJjUc2heaD4Pw2wObakCDVzkKztTm/Ln7eiVvYsjqak0Ed4LkMDA==", "dev": true }, + "axios": { + "version": "0.21.1", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz", + "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==", + "dev": true, + "requires": { + "follow-redirects": "^1.10.0" + } + }, "babel": { "version": "6.23.0", "resolved": "https://registry.npmjs.org/babel/-/babel-6.23.0.tgz", @@ -25051,6 +25248,21 @@ "tslib": "^1.9.0" } }, + "chromedriver": { + "version": "92.0.0", + "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-92.0.0.tgz", + "integrity": "sha512-IdJ5n5jLL6tCsGQF/fQHF2gDEhVzoYIqktUn6hE/BSsXlCcyDTi45fQbhTEhZlmshM8+BpnRtPuIT5DRbxNqKg==", + "dev": true, + "requires": { + "@testim/chrome-version": "^1.0.7", + "axios": "^0.21.1", + "del": "^6.0.0", + "extract-zip": "^2.0.1", + "https-proxy-agent": "^5.0.0", + "proxy-from-env": "^1.1.0", + "tcp-port-used": "^1.0.1" + } + }, "ci-info": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz", @@ -25660,15 +25872,6 @@ "find-up": "^4.0.0" } }, - "rimraf": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", - "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", - "dev": true, - "requires": { - "glob": "^7.1.3" - } - }, "schema-utils": { "version": "2.7.0", "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz", @@ -25870,11 +26073,11 @@ "dev": true }, "debug": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", - "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz", + "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==", "requires": { - "ms": "^2.1.1" + "ms": "2.1.2" } }, "decamelize": { @@ -26160,6 +26363,30 @@ } } }, + "del": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/del/-/del-6.0.0.tgz", + "integrity": "sha512-1shh9DQ23L16oXSZKB2JxpL7iMy2E0S9d517ptA1P8iw0alkPtQcrKH7ru31rYtKwF499HkTu+DRzq3TCKDFRQ==", + "dev": true, + "requires": { + "globby": "^11.0.1", + "graceful-fs": "^4.2.4", + "is-glob": "^4.0.1", + "is-path-cwd": "^2.2.0", + "is-path-inside": "^3.0.2", + "p-map": "^4.0.0", + "rimraf": "^3.0.2", + "slash": "^3.0.0" + }, + "dependencies": { + "slash": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz", + "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", + "dev": true + } + } + }, "delayed-stream": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", @@ -27366,6 +27593,29 @@ } } }, + "extract-zip": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-2.0.1.tgz", + "integrity": "sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==", + "dev": true, + "requires": { + "@types/yauzl": "^2.9.1", + "debug": "^4.1.1", + "get-stream": "^5.1.0", + "yauzl": "^2.10.0" + }, + "dependencies": { + "get-stream": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz", + "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==", + "dev": true, + "requires": { + "pump": "^3.0.0" + } + } + } + }, "extsprintf": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz", @@ -27688,17 +27938,6 @@ "requires": { "flatted": "^3.1.0", "rimraf": "^3.0.2" - }, - "dependencies": { - "rimraf": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", - "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", - "dev": true, - "requires": { - "glob": "^7.1.3" - } - } } }, "flatstr": { @@ -27728,6 +27967,12 @@ "readable-stream": "^2.3.6" } }, + "follow-redirects": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.1.tgz", + "integrity": "sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==", + "dev": true + }, "for-in": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz", @@ -28513,6 +28758,12 @@ "integrity": "sha512-CYdFeFexxhv/Bcny+Q0BfOV+ltRlJcd4BBZBYFX/O0u4npJrgZtIcjokegtiSMAvlMTJ+Koq0GBCc//3bueQxw==", "dev": true }, + "ip-regex": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-4.3.0.tgz", + "integrity": "sha512-B9ZWJxHHOHUhUjCPrMpLD4xEq35bUTClHM1S6CBU5ixQnkZmwipwgc96vAd7AAGM9TGHvJR+Uss+/Ak6UphK+Q==", + "dev": true + }, "ipaddr.js": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz", @@ -28748,6 +28999,12 @@ "dev": true, "peer": true }, + "is-path-cwd": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz", + "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==", + "dev": true + }, "is-path-inside": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz", @@ -28824,6 +29081,12 @@ "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=", "dev": true }, + "is-url": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz", + "integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==", + "dev": true + }, "is-utf8": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz", @@ -28850,6 +29113,17 @@ "integrity": "sha512-VjSeb/lHmkoyd8ryPVIKvOCn4D1koMqY+vqyjjUfc3xyKtP4dYOxM44sZrnqQSzSds3xyOrUTLTC9LVCVgLngw==", "dev": true }, + "is2": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/is2/-/is2-2.0.7.tgz", + "integrity": "sha512-4vBQoURAXC6hnLFxD4VW7uc04XiwTTl/8ydYJxKvPwkWQrSjInkuM5VZVg6BGr1/natq69zDuvO9lGpLClJqvA==", + "dev": true, + "requires": { + "deep-is": "^0.1.3", + "ip-regex": "^4.1.0", + "is-url": "^1.2.4" + } + }, "isarray": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", @@ -33896,6 +34170,12 @@ "ipaddr.js": "1.9.1" } }, + "proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==", + "dev": true + }, "prr": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz", @@ -34399,9 +34679,9 @@ "dev": true }, "rimraf": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.1.tgz", - "integrity": "sha512-IQ4ikL8SjBiEDZfk+DFVwqRK8md24RWMEJkdSlgNLkyyAImcjf8SWvU1qFMDOb4igBClbTQ/ugPqXcRwdFTxZw==", + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", + "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", "dev": true, "requires": { "glob": "^7.1.3" @@ -34518,6 +34798,18 @@ "commander": "^2.8.1" } }, + "selenium-webdriver": { + "version": "4.0.0-beta.4", + "resolved": "https://registry.npmjs.org/selenium-webdriver/-/selenium-webdriver-4.0.0-beta.4.tgz", + "integrity": "sha512-+s/CIYkWzmnC9WASBxxVj7Lm0dcyl6OaFxwIJaFCT5WCuACiimEEr4lUnOOFP/QlKfkDQ56m+aRczaq2EvJEJg==", + "dev": true, + "requires": { + "jszip": "^3.6.0", + "rimraf": "^3.0.2", + "tmp": "^0.2.1", + "ws": ">=7.4.6" + } + }, "semver": { "version": "6.3.0", "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", @@ -35551,6 +35843,16 @@ "xtend": "^4.0.0" } }, + "tcp-port-used": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/tcp-port-used/-/tcp-port-used-1.0.2.tgz", + "integrity": "sha512-l7ar8lLUD3XS1V2lfoJlCBaeoaWo/2xfYt81hM7VlvR4RrMVFqfmzfhLVk40hAb368uitje5gPtBRL1m/DGvLA==", + "dev": true, + "requires": { + "debug": "4.3.1", + "is2": "^2.0.6" + } + }, "terminal-link": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/terminal-link/-/terminal-link-2.1.1.tgz", diff --git a/package.json b/package.json index 49329b3f..df66bbc4 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,7 @@ "dependencies": { "@types/react": "^16.9.22", "@types/react-dom": "^16.9.5", + "@types/selenium-webdriver": "^4.0.15", "babel": "^6.23.0", "babel-core": "^6.26.3", "babel-loader": "^8.0.6", @@ -21,11 +22,13 @@ "@types/jquery": "^3.3.31", "@typescript-eslint/eslint-plugin": "^4.9.1", "@typescript-eslint/parser": "^4.9.1", + "chromedriver": "^92.0.0", "copy-webpack-plugin": "^6.0.3", "eslint": "^7.15.0", "eslint-plugin-react": "^7.21.5", "jest": "^27.0.6", "rimraf": "^3.0.0", + "selenium-webdriver": "^4.0.0-beta.4", "ts-jest": "^27.0.3", "ts-loader": "^6.2.1", "typescript": "~4.3", diff --git a/test/selenium.test.ts b/test/selenium.test.ts new file mode 100644 index 00000000..4cd292dd --- /dev/null +++ b/test/selenium.test.ts @@ -0,0 +1,44 @@ +import { Builder, By, until, Key } from "selenium-webdriver"; +import * as Chrome from "selenium-webdriver/chrome"; +import * as Path from "path"; + +test("Selenium Chrome test", async () => { + const options = new Chrome.Options(); + options.addArguments("--load-extension=" + Path.join(__dirname, "../dist/")); + options.addArguments("--mute-audio"); + options.addArguments("--disable-features=PreloadMediaEngagementData, MediaEngagementBypassAutoplayPolicies") + + const driver = await new Builder().forBrowser("chrome").setChromeOptions(options).build(); + driver.manage().setTimeouts({ + implicit: 5000 + }); + + try { + // Selenium only knows about the one tab it's on, + // so we can't wait for the help page to appear + await driver.sleep(3000); + // This video has no ads + await driver.get("https://www.youtube.com/watch?v=jNQXAC9IVRw"); + await driver.wait(until.elementIsVisible(await driver.findElement(By.className("ytd-video-primary-info-renderer")))); + + const startSegmentButton = await driver.findElement(By.id("startSegmentButton")); + const cancelSegmentButton = await driver.findElement(By.id("cancelSegmentButton")); + await driver.executeScript("document.querySelector('video').currentTime = 0"); + + await startSegmentButton.click(); + await driver.wait(until.elementIsVisible(cancelSegmentButton)); + + await driver.executeScript("document.querySelector('video').currentTime = 10.33"); + + await startSegmentButton.click(); + await driver.wait(until.elementIsNotVisible(cancelSegmentButton)); + + const submitButton = await driver.findElement(By.id("submitButton")); + await submitButton.click(); + + const sponsorTimeDisplay = await driver.findElement(By.className("sponsorTimeDisplay")); + await driver.wait(until.elementTextIs(sponsorTimeDisplay, "0:00.000 to 0:10.330")); + } finally { + await driver.quit(); + } +}, 100_000); \ No newline at end of file From b9bbbebc106f761002247540f421e66471024a1a Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Fri, 30 Jul 2021 15:53:57 -0400 Subject: [PATCH 02/29] Add test for editing --- test/selenium.test.ts | 80 +++++++++++++++++++++++++++++++++---------- 1 file changed, 62 insertions(+), 18 deletions(-) diff --git a/test/selenium.test.ts b/test/selenium.test.ts index 4cd292dd..f87e92cf 100644 --- a/test/selenium.test.ts +++ b/test/selenium.test.ts @@ -1,4 +1,4 @@ -import { Builder, By, until, Key } from "selenium-webdriver"; +import { Builder, By, until, Key, WebDriver } from "selenium-webdriver"; import * as Chrome from "selenium-webdriver/chrome"; import * as Path from "path"; @@ -21,24 +21,68 @@ test("Selenium Chrome test", async () => { await driver.get("https://www.youtube.com/watch?v=jNQXAC9IVRw"); await driver.wait(until.elementIsVisible(await driver.findElement(By.className("ytd-video-primary-info-renderer")))); - const startSegmentButton = await driver.findElement(By.id("startSegmentButton")); - const cancelSegmentButton = await driver.findElement(By.id("cancelSegmentButton")); - await driver.executeScript("document.querySelector('video').currentTime = 0"); + await createSegment(driver, "4", "10.33", "0:04.000 to 0:10.330"); - await startSegmentButton.click(); - await driver.wait(until.elementIsVisible(cancelSegmentButton)); - - await driver.executeScript("document.querySelector('video').currentTime = 10.33"); - - await startSegmentButton.click(); - await driver.wait(until.elementIsNotVisible(cancelSegmentButton)); - - const submitButton = await driver.findElement(By.id("submitButton")); - await submitButton.click(); - - const sponsorTimeDisplay = await driver.findElement(By.className("sponsorTimeDisplay")); - await driver.wait(until.elementTextIs(sponsorTimeDisplay, "0:00.000 to 0:10.330")); + await editSegments(driver, 0, "0:04.000", "0:10.330", "5", "13.211", "0:05.000 to 0:13.211", false); } finally { await driver.quit(); } -}, 100_000); \ No newline at end of file +}, 100_000); + +async function createSegment(driver: WebDriver, startTime: string, endTime: string, expectedDisplayedTime: string): Promise { + const startSegmentButton = await driver.findElement(By.id("startSegmentButton")); + const cancelSegmentButton = await driver.findElement(By.id("cancelSegmentButton")); + await driver.executeScript("document.querySelector('video').currentTime = " + startTime); + + await startSegmentButton.click(); + await driver.wait(until.elementIsVisible(cancelSegmentButton)); + + await driver.executeScript("document.querySelector('video').currentTime = " + endTime); + + await startSegmentButton.click(); + await driver.wait(until.elementIsNotVisible(cancelSegmentButton)); + + const submitButton = await driver.findElement(By.id("submitButton")); + await submitButton.click(); + + const sponsorTimeDisplays = await driver.findElements(By.className("sponsorTimeDisplay")); + const sponsorTimeDisplay = sponsorTimeDisplays[sponsorTimeDisplays.length - 1]; + await driver.wait(until.elementTextIs(sponsorTimeDisplay, expectedDisplayedTime)); +} + +async function editSegments(driver: WebDriver, index: number, expectedStartTimeBox: string, expectedEndTimeBox: string, + startTime: string, endTime: string, expectedDisplayedTime: string, openSubmitBox: boolean): Promise { + + if (openSubmitBox) { + const submitButton = await driver.findElement(By.id("submitButton")); + await submitButton.click(); + } + + let editButton = await driver.findElement(By.id("sponsorTimeEditButtonSubmissionNotice" + index)); + let sponsorTimeDisplays = await driver.findElements(By.className("sponsorTimeDisplay")); + let sponsorTimeDisplay = sponsorTimeDisplays[index]; + await sponsorTimeDisplay.click(); + // Ensure edit time appears + await driver.findElement(By.id("submittingTime0SubmissionNotice" + index)); + + // Try the edit button too + await editButton.click(); + await editButton.click(); + + const startTimeBox = await driver.findElement(By.id("submittingTime0SubmissionNotice" + index)); + expect((await startTimeBox.getAttribute("value"))).toBe(expectedStartTimeBox); + await startTimeBox.clear(); + await startTimeBox.sendKeys(startTime); + + const endTimeBox = await driver.findElement(By.id("submittingTime1SubmissionNotice" + index)); + expect((await endTimeBox.getAttribute("value"))).toBe(expectedEndTimeBox); + await endTimeBox.clear(); + await endTimeBox.sendKeys(endTime); + + editButton = await driver.findElement(By.id("sponsorTimeEditButtonSubmissionNotice" + index)); + await editButton.click(); + + sponsorTimeDisplays = await driver.findElements(By.className("sponsorTimeDisplay")); + sponsorTimeDisplay = sponsorTimeDisplays[index]; + await driver.wait(until.elementTextIs(sponsorTimeDisplay, expectedDisplayedTime)); +} \ No newline at end of file From 3187efaf1a0ebf8174a9df05c57c0c85371c605f Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Fri, 30 Jul 2021 16:00:59 -0400 Subject: [PATCH 03/29] Add test for skipping preview segment --- test/selenium.test.ts | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/test/selenium.test.ts b/test/selenium.test.ts index f87e92cf..f06de269 100644 --- a/test/selenium.test.ts +++ b/test/selenium.test.ts @@ -24,6 +24,8 @@ test("Selenium Chrome test", async () => { await createSegment(driver, "4", "10.33", "0:04.000 to 0:10.330"); await editSegments(driver, 0, "0:04.000", "0:10.330", "5", "13.211", "0:05.000 to 0:13.211", false); + + await skipSegment(driver, 5, 13.211); } finally { await driver.quit(); } @@ -85,4 +87,16 @@ async function editSegments(driver: WebDriver, index: number, expectedStartTimeB sponsorTimeDisplays = await driver.findElements(By.className("sponsorTimeDisplay")); sponsorTimeDisplay = sponsorTimeDisplays[index]; await driver.wait(until.elementTextIs(sponsorTimeDisplay, expectedDisplayedTime)); +} + +async function skipSegment(driver: WebDriver, startTime: number, endTime: number): Promise { + const video = await driver.findElement(By.css("video")); + + await driver.executeScript("document.querySelector('video').currentTime = " + (startTime - 0.5)); + await driver.executeScript("document.querySelector('video').play()"); + + await driver.sleep(1000); + + expect(parseFloat(await video.getAttribute("currentTime"))).toBeGreaterThan(endTime); + await driver.executeScript("document.querySelector('video').pause()"); } \ No newline at end of file From d73c666e1ff8cef5ed76cbf8a4496e7217bbae6d Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Fri, 30 Jul 2021 23:34:15 -0400 Subject: [PATCH 04/29] Extract out setup steps --- test/selenium.test.ts | 51 ++++++++++++++++++++++++++++--------------- 1 file changed, 34 insertions(+), 17 deletions(-) diff --git a/test/selenium.test.ts b/test/selenium.test.ts index f06de269..530546fa 100644 --- a/test/selenium.test.ts +++ b/test/selenium.test.ts @@ -1,8 +1,26 @@ -import { Builder, By, until, Key, WebDriver } from "selenium-webdriver"; +import { Builder, By, until, WebDriver } from "selenium-webdriver"; import * as Chrome from "selenium-webdriver/chrome"; import * as Path from "path"; test("Selenium Chrome test", async () => { + const driver = await setup(); + + try { + await waitForInstall(driver); + // This video has no ads + await goToVideo(driver, "jNQXAC9IVRw"); + + await createSegment(driver, "4", "10.33", "0:04.000 to 0:10.330"); + + await editSegments(driver, 0, "0:04.000", "0:10.330", "5", "13.211", "0:05.000 to 0:13.211", false); + + await autoskipSegment(driver, 5, 13.211); + } finally { + await driver.quit(); + } +}, 100_000); + +async function setup(): Promise { const options = new Chrome.Options(); options.addArguments("--load-extension=" + Path.join(__dirname, "../dist/")); options.addArguments("--mute-audio"); @@ -13,23 +31,22 @@ test("Selenium Chrome test", async () => { implicit: 5000 }); - try { - // Selenium only knows about the one tab it's on, - // so we can't wait for the help page to appear - await driver.sleep(3000); - // This video has no ads - await driver.get("https://www.youtube.com/watch?v=jNQXAC9IVRw"); - await driver.wait(until.elementIsVisible(await driver.findElement(By.className("ytd-video-primary-info-renderer")))); + return driver; +} - await createSegment(driver, "4", "10.33", "0:04.000 to 0:10.330"); +async function waitForInstall(driver: WebDriver, startingTab = 0): Promise { + // Selenium only knows about the one tab it's on, + // so we can't wait for the help page to appear + await driver.sleep(3000); - await editSegments(driver, 0, "0:04.000", "0:10.330", "5", "13.211", "0:05.000 to 0:13.211", false); + const handles = await driver.getAllWindowHandles(); + await driver.switchTo().window(handles[startingTab]); +} - await skipSegment(driver, 5, 13.211); - } finally { - await driver.quit(); - } -}, 100_000); +async function goToVideo(driver: WebDriver, videoId: string): Promise { + await driver.get("https://www.youtube.com/watch?v=" + videoId); + await driver.wait(until.elementIsVisible(await driver.findElement(By.className("ytd-video-primary-info-renderer")))); +} async function createSegment(driver: WebDriver, startTime: string, endTime: string, expectedDisplayedTime: string): Promise { const startSegmentButton = await driver.findElement(By.id("startSegmentButton")); @@ -89,13 +106,13 @@ async function editSegments(driver: WebDriver, index: number, expectedStartTimeB await driver.wait(until.elementTextIs(sponsorTimeDisplay, expectedDisplayedTime)); } -async function skipSegment(driver: WebDriver, startTime: number, endTime: number): Promise { +async function autoskipSegment(driver: WebDriver, startTime: number, endTime: number): Promise { const video = await driver.findElement(By.css("video")); await driver.executeScript("document.querySelector('video').currentTime = " + (startTime - 0.5)); await driver.executeScript("document.querySelector('video').play()"); - await driver.sleep(1000); + await driver.sleep(1300); expect(parseFloat(await video.getAttribute("currentTime"))).toBeGreaterThan(endTime); await driver.executeScript("document.querySelector('video').pause()"); From 788d4bf73c1c1eff5a533dcb8c7c70e480ee1f3b Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Fri, 30 Jul 2021 23:36:31 -0400 Subject: [PATCH 05/29] Build before running test --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index df66bbc4..117d7d45 100644 --- a/package.json +++ b/package.json @@ -56,7 +56,8 @@ "dev:firefox": "npm run build:dev:firefox && concurrently \"npm run web-run:firefox\" \"npm run build:watch:firefox\"", "dev:firefox-android": "npm run build:dev:firefox && concurrently \"npm run web-run:firefox-android\" \"npm run build:watch:firefox\"", "clean": "rimraf dist", - "test": "npx jest", + "test": "npm run build:chrome && npx jest", + "testWithoutBuilding": "npx jest", "lint": "eslint src", "lint:fix": "eslint src --fix" }, From 4ef8e36821ea9bd814f190bb04491c2833ca542e Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Fri, 30 Jul 2021 23:37:13 -0400 Subject: [PATCH 06/29] Fix build step casing --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 117d7d45..f2f06f6a 100644 --- a/package.json +++ b/package.json @@ -57,7 +57,7 @@ "dev:firefox-android": "npm run build:dev:firefox && concurrently \"npm run web-run:firefox-android\" \"npm run build:watch:firefox\"", "clean": "rimraf dist", "test": "npm run build:chrome && npx jest", - "testWithoutBuilding": "npx jest", + "test-without-building": "npx jest", "lint": "eslint src", "lint:fix": "eslint src --fix" }, From b1aaa0ac5ea7fcaa62cea89640db594aabd84bab Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Wed, 1 Sep 2021 04:22:06 -0400 Subject: [PATCH 07/29] Add copy public id button --- public/_locales/en/messages.json | 3 +++ public/popup.css | 10 +++++++++- public/popup.html | 3 +++ src/content.ts | 2 ++ src/popup.ts | 2 ++ 5 files changed, 19 insertions(+), 1 deletion(-) diff --git a/public/_locales/en/messages.json b/public/_locales/en/messages.json index 3e7a3acf..2b85bb14 100644 --- a/public/_locales/en/messages.json +++ b/public/_locales/en/messages.json @@ -161,6 +161,9 @@ "setUsername": { "message": "Set Username" }, + "copyPublicID": { + "message": "Copy Public UserID" + }, "discordAdvert": { "message": "Come join the official discord server to give suggestions and feedback!" }, diff --git a/public/popup.css b/public/popup.css index 4398eaa4..96259cf2 100644 --- a/public/popup.css +++ b/public/popup.css @@ -265,7 +265,7 @@ background-color:#ec1c1c; align-items: center; } -.sbSlimButton, #additionalButtons>button, button#setUsernameButton, #submitUsername { +.sbSlimButton, #additionalButtons>button, button#setUsernameButton, #submitUsername, #copyUserID { background: none; border: none; color: white; @@ -341,6 +341,14 @@ label>p, #disableExtension>p, #usernameValue, #usernameElement > div > p,#sponso cursor: pointer; } +#copyUserID { + width: 100%; +} + +#setUsernameContainer { + display: flex; +} + #usernameElement > div, #sponsorTimesContributionsContainer > div { display: flex; flex-flow: column nowrap; diff --git a/public/popup.html b/public/popup.html index 80e0d1da..c6600bdc 100644 --- a/public/popup.html +++ b/public/popup.html @@ -90,6 +90,9 @@ + +
{/* Editing Tools */} @@ -269,6 +282,21 @@ class SponsorTimeEditComponent extends React.Component + {chrome.i18n.getMessage(actionType)} + + ); + } + + return elements; + } + setTimeToNow(index: number): void { this.setTimeTo(index, this.props.contentContainer().getRealCurrentTime()); } @@ -331,6 +359,7 @@ class SponsorTimeEditComponent extends React.Component Date: Wed, 1 Sep 2021 19:51:42 -0400 Subject: [PATCH 14/29] Add silent skipping to scheduler --- src/content.ts | 121 +++++++++++++++++++++++++++++++++++-------------- src/types.ts | 4 ++ tsconfig.json | 7 ++- 3 files changed, 96 insertions(+), 36 deletions(-) diff --git a/src/content.ts b/src/content.ts index a2405677..0cb95b37 100644 --- a/src/content.ts +++ b/src/content.ts @@ -1,5 +1,5 @@ import Config from "./config"; -import { SponsorTime, CategorySkipOption, VideoID, SponsorHideType, VideoInfo, StorageChangesObject, CategoryActionType, ChannelIDInfo, ChannelIDStatus, SponsorSourceType, SegmentUUID, Category, SkipToTimeParams, ToggleSkippable, ActionType } from "./types"; +import { SponsorTime, CategorySkipOption, VideoID, SponsorHideType, VideoInfo, StorageChangesObject, CategoryActionType, ChannelIDInfo, ChannelIDStatus, SponsorSourceType, SegmentUUID, Category, SkipToTimeParams, ToggleSkippable, ActionType, ScheduledTime } from "./types"; import { ContentContainer } from "./types"; import Utils from "./utils"; @@ -45,6 +45,7 @@ let sponsorSkipped: boolean[] = []; //the video let video: HTMLVideoElement; +let videoMuted = false; // Has it been attempted to be muted let videoMutationObserver: MutationObserver = null; // List of videos that have had event listeners added to them const videosWithEventListeners: HTMLVideoElement[] = []; @@ -396,7 +397,6 @@ function cancelSponsorSchedule(): void { } /** - * * @param currentTime Optional if you don't want to use the actual current time */ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?: number, includeNonIntersectingSegments = true): void { @@ -412,6 +412,12 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?: } if (!video || video.paused) return; + if (currentTime === undefined || currentTime === null) currentTime = video.currentTime; + + if (videoMuted && !inMuteSegment(currentTime)) { + video.muted = false; + videoMuted = false; + } if (Config.config.disableSkipping || channelWhitelisted || (channelIDInfo.status === ChannelIDStatus.Fetching && Config.config.forceChannelCheck)){ return; @@ -419,14 +425,12 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?: if (incorrectVideoCheck()) return; - if (currentTime === undefined || currentTime === null) currentTime = video.currentTime; - const skipInfo = getNextSkipIndex(currentTime, includeIntersectingSegments, includeNonIntersectingSegments); if (skipInfo.index === -1) return; const currentSkip = skipInfo.array[skipInfo.index]; - const skipTime: number[] = [currentSkip.segment[0], skipInfo.array[skipInfo.endIndex].segment[1]]; + const skipTime: number[] = [currentSkip.scheduledTime, skipInfo.array[skipInfo.endIndex].segment[1]]; const timeUntilSponsor = skipTime[0] - currentTime; const videoID = sponsorVideoID; @@ -461,7 +465,8 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?: openNotice: skipInfo.openNotice }); - if (utils.getCategorySelection(currentSkip.category)?.option === CategorySkipOption.ManualSkip) { + if (utils.getCategorySelection(currentSkip.category)?.option === CategorySkipOption.ManualSkip + || currentSkip.actionType === ActionType.Mute) { forcedSkipTime = skipTime[0] + 0.001; } else { forcedSkipTime = skipTime[1]; @@ -480,12 +485,19 @@ function startSponsorSchedule(includeIntersectingSegments = false, currentTime?: } } +function inMuteSegment(currentTime: number): boolean { + const checkFunction = (segment) => segment.actionType === ActionType.Mute && segment.segment[0] <= currentTime && segment.segment[1] > currentTime; + return sponsorTimes.some(checkFunction) || sponsorTimesSubmitting.some(checkFunction); +} + /** * This makes sure the videoID is still correct and if the sponsorTime is included */ function incorrectVideoCheck(videoID?: string, sponsorTime?: SponsorTime): boolean { const currentVideoID = getYouTubeVideoID(document.URL); - if (currentVideoID !== (videoID || sponsorVideoID) || (sponsorTime && (!sponsorTimes || !sponsorTimes.includes(sponsorTime)) && !sponsorTimesSubmitting.includes(sponsorTime))) { + if (currentVideoID !== (videoID || sponsorVideoID) || (sponsorTime + && (!sponsorTimes || !sponsorTimes.some((time) => time.segment === sponsorTime.segment)) + && !sponsorTimesSubmitting.some((time) => time.segment === sponsorTime.segment))) { // Something has really gone wrong console.error("[SponsorBlock] The videoID recorded when trying to skip is different than what it should be."); console.error("[SponsorBlock] VideoID recorded: " + sponsorVideoID + ". Actual VideoID: " + currentVideoID); @@ -946,31 +958,33 @@ async function whitelistCheck() { * Returns info about the next upcoming sponsor skip */ function getNextSkipIndex(currentTime: number, includeIntersectingSegments: boolean, includeNonIntersectingSegments: boolean): - {array: SponsorTime[], index: number, endIndex: number, openNotice: boolean} { + {array: ScheduledTime[], index: number, endIndex: number, openNotice: boolean} { - const sponsorStartTimes = getStartTimes(sponsorTimes, includeIntersectingSegments, includeNonIntersectingSegments); - const sponsorStartTimesAfterCurrentTime = getStartTimes(sponsorTimes, includeIntersectingSegments, includeNonIntersectingSegments, currentTime, true, true); + const { includedTimes: submittedArray, startTimeIndexes: sponsorStartTimes } = + getStartTimes(sponsorTimes, includeIntersectingSegments, includeNonIntersectingSegments); + const { startTimeIndexes: sponsorStartTimesAfterCurrentTime } = getStartTimes(sponsorTimes, includeIntersectingSegments, includeNonIntersectingSegments, currentTime, true, true); const minSponsorTimeIndex = sponsorStartTimes.indexOf(Math.min(...sponsorStartTimesAfterCurrentTime)); - const endTimeIndex = getLatestEndTimeIndex(sponsorTimes, minSponsorTimeIndex); + const endTimeIndex = getLatestEndTimeIndex(submittedArray, minSponsorTimeIndex); - const unsubmittedSponsorStartTimes = getStartTimes(sponsorTimesSubmitting, includeIntersectingSegments, includeNonIntersectingSegments); - const unsubmittedSponsorStartTimesAfterCurrentTime = getStartTimes(sponsorTimesSubmitting, includeIntersectingSegments, includeNonIntersectingSegments, currentTime, false, false); + const { includedTimes: unsubmittedArray, startTimeIndexes: unsubmittedSponsorStartTimes } = + getStartTimes(sponsorTimesSubmitting, includeIntersectingSegments, includeNonIntersectingSegments); + const { startTimeIndexes: unsubmittedSponsorStartTimesAfterCurrentTime } = getStartTimes(sponsorTimesSubmitting, includeIntersectingSegments, includeNonIntersectingSegments, currentTime, false, false); const minUnsubmittedSponsorTimeIndex = unsubmittedSponsorStartTimes.indexOf(Math.min(...unsubmittedSponsorStartTimesAfterCurrentTime)); - const previewEndTimeIndex = getLatestEndTimeIndex(sponsorTimesSubmitting, minUnsubmittedSponsorTimeIndex); + const previewEndTimeIndex = getLatestEndTimeIndex(unsubmittedArray, minUnsubmittedSponsorTimeIndex); if ((minUnsubmittedSponsorTimeIndex === -1 && minSponsorTimeIndex !== -1) || sponsorStartTimes[minSponsorTimeIndex] < unsubmittedSponsorStartTimes[minUnsubmittedSponsorTimeIndex]) { return { - array: sponsorTimes.filter((segment) => getCategoryActionType(segment.category) === CategoryActionType.Skippable), + array: submittedArray, index: minSponsorTimeIndex, endIndex: endTimeIndex, openNotice: true }; } else { return { - array: sponsorTimesSubmitting.filter((segment) => getCategoryActionType(segment.category) === CategoryActionType.Skippable), + array: unsubmittedArray, index: minUnsubmittedSponsorTimeIndex, endIndex: previewEndTimeIndex, openNotice: false @@ -994,7 +1008,10 @@ function getNextSkipIndex(currentTime: number, includeIntersectingSegments: bool function getLatestEndTimeIndex(sponsorTimes: SponsorTime[], index: number, hideHiddenSponsors = true): number { // Only combine segments for AutoSkip if (index == -1 || - !shouldAutoSkip(sponsorTimes[index])) return index; + !shouldAutoSkip(sponsorTimes[index]) + || sponsorTimes[index].actionType !== ActionType.Skip) { + return index; + } // Default to the normal endTime let latestEndTimeIndex = index; @@ -1005,7 +1022,8 @@ function getLatestEndTimeIndex(sponsorTimes: SponsorTime[], index: number, hideH if (currentSegment[0] <= latestEndTime && currentSegment[1] > latestEndTime && (!hideHiddenSponsors || sponsorTimes[i].hidden === SponsorHideType.Visible) - && shouldAutoSkip(sponsorTimes[i])) { + && shouldAutoSkip(sponsorTimes[i]) + && sponsorTimes[i].actionType === ActionType.Skip) { // Overlapping segment latestEndTimeIndex = i; } @@ -1030,24 +1048,43 @@ function getLatestEndTimeIndex(sponsorTimes: SponsorTime[], index: number, hideH * the current time, but end after */ function getStartTimes(sponsorTimes: SponsorTime[], includeIntersectingSegments: boolean, includeNonIntersectingSegments: boolean, - minimum?: number, onlySkippableSponsors = false, hideHiddenSponsors = false): number[] { - if (sponsorTimes === null) return []; + minimum?: number, onlySkippableSponsors = false, hideHiddenSponsors = false): {includedTimes: ScheduledTime[], startTimeIndexes: number[]} { + if (!sponsorTimes) return {includedTimes: [], startTimeIndexes: []}; - const startTimes: number[] = []; + const includedTimes: ScheduledTime[] = []; + const startTimeIndexes: number[] = []; - for (let i = 0; i < sponsorTimes?.length; i++) { + const possibleTimes = sponsorTimes.flatMap((sponsorTime) => { + const results = [{ + ...sponsorTime, + scheduledTime: sponsorTime.segment[0] + }] + + if (sponsorTime.actionType === ActionType.Mute) { + // Schedule at the end time to know when to unmute + results.push({ + ...sponsorTime, + scheduledTime: sponsorTime.segment[1] + }) + } + + return results; + }) + + for (let i = 0; i < possibleTimes.length; i++) { if ((minimum === undefined - || ((includeNonIntersectingSegments && sponsorTimes[i].segment[0] >= minimum) - || (includeIntersectingSegments && sponsorTimes[i].segment[0] < minimum && sponsorTimes[i].segment[1] > minimum))) - && (!onlySkippableSponsors || shouldSkip(sponsorTimes[i])) - && (!hideHiddenSponsors || sponsorTimes[i].hidden === SponsorHideType.Visible) - && getCategoryActionType(sponsorTimes[i].category) === CategoryActionType.Skippable) { + || ((includeNonIntersectingSegments && possibleTimes[i].scheduledTime >= minimum) + || (includeIntersectingSegments && possibleTimes[i].scheduledTime < minimum && possibleTimes[i].segment[1] > minimum))) + && (!onlySkippableSponsors || shouldSkip(possibleTimes[i])) + && (!hideHiddenSponsors || possibleTimes[i].hidden === SponsorHideType.Visible) + && getCategoryActionType(possibleTimes[i].category) === CategoryActionType.Skippable) { - startTimes.push(sponsorTimes[i].segment[0]); + startTimeIndexes.push(possibleTimes[i].scheduledTime); + includedTimes.push(possibleTimes[i]); } } - return startTimes; + return { includedTimes, startTimeIndexes }; } /** @@ -1093,13 +1130,27 @@ function skipToTime({v, skipTime, skippingSegments, openNotice, forceAutoSkip, u if ((autoSkip || sponsorTimesSubmitting.some((time) => time.segment === skippingSegments[0].segment)) && v.currentTime !== skipTime[1]) { - // Fix for looped videos not working when skipping to the end #426 - // for some reason you also can't skip to 1 second before the end - if (v.loop && v.duration > 1 && skipTime[1] >= v.duration - 1) { - v.currentTime = 0; - } else { - v.currentTime = skipTime[1]; + switch(skippingSegments[0].actionType) { + case ActionType.Skip: { + // Fix for looped videos not working when skipping to the end #426 + // for some reason you also can't skip to 1 second before the end + if (v.loop && v.duration > 1 && skipTime[1] >= v.duration - 1) { + v.currentTime = 0; + } else { + v.currentTime = skipTime[1]; + } + + break; + } + case ActionType.Mute: { + if (!v.muted) { + v.muted = true; + videoMuted = true; + } + break; + } } + } if (!autoSkip diff --git a/src/types.ts b/src/types.ts index 5635039e..cb5cc0e2 100644 --- a/src/types.ts +++ b/src/types.ts @@ -82,6 +82,10 @@ export interface SponsorTime { source?: SponsorSourceType; } +export interface ScheduledTime extends SponsorTime { + scheduledTime: number; +} + export interface PreviewBarOption { color: string, opacity: string diff --git a/tsconfig.json b/tsconfig.json index 8fa7472c..55769505 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -8,6 +8,11 @@ "noEmitOnError": false, "typeRoots": [ "node_modules/@types" ], "resolveJsonModule": true, - "jsx": "react" + "jsx": "react", + "lib": [ + "es2019", + "dom", + "dom.iterable" + ] } } \ No newline at end of file From 4092bf9b0546f13be383937fbc052d3b9c1abdca Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Wed, 1 Sep 2021 20:52:40 -0400 Subject: [PATCH 15/29] Make skip notice buttons work with mute segments --- public/_locales/en/messages.json | 3 + src/components/SkipNoticeComponent.tsx | 102 +++++++++++++++++-------- src/content.ts | 30 +++++--- 3 files changed, 92 insertions(+), 43 deletions(-) diff --git a/public/_locales/en/messages.json b/public/_locales/en/messages.json index d579ac45..043d64e0 100644 --- a/public/_locales/en/messages.json +++ b/public/_locales/en/messages.json @@ -52,6 +52,9 @@ "reskip": { "message": "Reskip" }, + "unmute": { + "message": "Unmute" + }, "paused": { "message": "Paused" }, diff --git a/src/components/SkipNoticeComponent.tsx b/src/components/SkipNoticeComponent.tsx index 0af1efad..b3ca619b 100644 --- a/src/components/SkipNoticeComponent.tsx +++ b/src/components/SkipNoticeComponent.tsx @@ -1,7 +1,7 @@ import * as React from "react"; import * as CompileConfig from "../../config.json"; import Config from "../config" -import { Category, ContentContainer, CategoryActionType, SponsorHideType, SponsorTime, NoticeVisbilityMode } from "../types"; +import { Category, ContentContainer, CategoryActionType, SponsorHideType, SponsorTime, NoticeVisbilityMode, ActionType } from "../types"; import NoticeComponent from "./NoticeComponent"; import NoticeTextSelectionComponent from "./NoticeTextSectionComponent"; @@ -39,8 +39,8 @@ export interface SkipNoticeState { maxCountdownTime?: () => number; countdownText?: string; - unskipText?: string; - unskipCallback?: (index: number) => void; + skipButtonText?: string; + skipButtonCallback?: (index: number) => void; downvoting?: boolean; choosingCategory?: boolean; @@ -110,8 +110,8 @@ class SkipNoticeComponent extends React.Component this.unskip(index), + skipButtonText: this.getUnskipText(), + skipButtonCallback: (index) => this.unskip(index), downvoting: false, choosingCategory: false, @@ -126,7 +126,7 @@ class SkipNoticeComponent extends React.Component this.prepAction(SkipNoticeAction.Unskip)}> - {this.state.unskipText + (this.state.showKeybindHint ? " (" + Config.config.skipKeybind + ")" : "")} + {this.state.skipButtonText + (this.state.showKeybindHint ? " (" + Config.config.skipKeybind + ")" : "")} ); @@ -396,7 +396,7 @@ class SkipNoticeComponent extends React.Component Config.config.skipNoticeDuration, + countdownTime: Config.config.skipNoticeDuration + }; + + // See if the title should be changed + if (!this.autoSkip) { + newState.noticeTitle = chrome.i18n.getMessage("noticeTitle"); + } + + //reset countdown + this.setState(newState, () => { + this.noticeRef.current.resetCountdown(); + }); } /** Sets up notice to be not skipped yet */ @@ -478,36 +500,14 @@ class SkipNoticeComponent extends React.Component this.reskip(index), + skipButtonText: buttonText, + skipButtonCallback: (index) => this.reskip(index), // change max duration to however much of the sponsor is left maxCountdownTime: maxCountdownTime, countdownTime: maxCountdownTime() } as SkipNoticeState; } - reskip(index: number): void { - this.contentContainer().reskipSponsorTime(this.segments[index]); - - const newState: SkipNoticeState = { - unskipText: chrome.i18n.getMessage("unskip"), - unskipCallback: this.unskip.bind(this), - - maxCountdownTime: () => Config.config.skipNoticeDuration, - countdownTime: Config.config.skipNoticeDuration - }; - - // See if the title should be changed - if (!this.autoSkip) { - newState.noticeTitle = chrome.i18n.getMessage("noticeTitle"); - } - - //reset countdown - this.setState(newState, () => { - this.noticeRef.current.resetCountdown(); - }); - } - afterVote(segment: SponsorTime, type: number, category: Category): void { this.addVoteButtonInfo(chrome.i18n.getMessage("voted")); @@ -558,6 +558,42 @@ class SkipNoticeComponent extends React.Component manualSkipPercentCount; - - video.currentTime = segment.segment[1]; - sendTelemetryAndCount([segment], skippedTime, fullSkip); - startSponsorSchedule(true, segment.segment[1], false); + if (segment.actionType === ActionType.Mute) { + video.muted = true; + videoMuted = true; + } else { + const skippedTime = Math.max(segment.segment[1] - video.currentTime, 0); + const segmentDuration = segment.segment[1] - segment.segment[0]; + const fullSkip = skippedTime / segmentDuration > manualSkipPercentCount; + + video.currentTime = segment.segment[1]; + sendTelemetryAndCount([segment], skippedTime, fullSkip); + startSponsorSchedule(true, segment.segment[1], false); + } } function createButton(baseID: string, title: string, callback: () => void, imageName: string, isDraggable = false): HTMLElement { From 60e54ee1294747c3d15a8b17dad0940dbcf1345a Mon Sep 17 00:00:00 2001 From: Ajay Ramachandran Date: Wed, 1 Sep 2021 21:03:32 -0400 Subject: [PATCH 16/29] Hide unmute buttons after segment is finished --- src/components/SkipNoticeComponent.tsx | 16 ++++++++++++++-- src/content.ts | 5 +++++ src/render/SkipNotice.tsx | 4 ++++ 3 files changed, 23 insertions(+), 2 deletions(-) diff --git a/src/components/SkipNoticeComponent.tsx b/src/components/SkipNoticeComponent.tsx index b3ca619b..0900557f 100644 --- a/src/components/SkipNoticeComponent.tsx +++ b/src/components/SkipNoticeComponent.tsx @@ -41,6 +41,7 @@ export interface SkipNoticeState { skipButtonText?: string; skipButtonCallback?: (index: number) => void; + showSkipButton?: boolean; downvoting?: boolean; choosingCategory?: boolean; @@ -112,6 +113,7 @@ class SkipNoticeComponent extends React.Component this.unskip(index), + showSkipButton: true, downvoting: false, choosingCategory: false, @@ -296,9 +298,9 @@ class SkipNoticeComponent extends React.Component 1 + if (this.state.showSkipButton && (this.segments.length > 1 || getCategoryActionType(this.segments[0].category) !== CategoryActionType.POI - || this.props.unskipTime) { + || this.props.unskipTime)) { return (