From 87a72f35c1ead09ce855876261e379a84e61c00d Mon Sep 17 00:00:00 2001 From: undefined Date: Sun, 22 May 2022 02:02:48 +0800 Subject: [PATCH] ui: add matchMedia().addEventListener polyfill --- .vscode/settings.json | 2 - package.json | 10 +-- packages/hydrooj/package.json | 2 +- .../ui-default/components/editor/index.ts | 2 + packages/ui-default/package.json | 11 ++-- packages/ui-default/polyfill.ts | 64 +++++++++++++++++++ .../ui-default/templates/layout/html5.html | 2 +- packages/vjudge/package.json | 2 +- 8 files changed, 80 insertions(+), 15 deletions(-) diff --git a/.vscode/settings.json b/.vscode/settings.json index bf984bdc..fc33839c 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -3,8 +3,6 @@ "files.encoding": "utf8", "files.eol": "\n", "editor.detectIndentation": true, - "editor.formatOnSave": true, - "editor.renderWhitespace": "boundary", "typescript.tsdk": "node_modules/typescript/lib", "[json]": { "files.insertFinalNewline": true, diff --git a/package.json b/package.json index 3905b771..83e46dce 100644 --- a/package.json +++ b/package.json @@ -33,24 +33,24 @@ "@types/autocannon": "^7.6.1", "@types/cross-spawn": "^6.0.2", "@types/mocha": "^9.1.1", - "@types/node": "^17.0.33", + "@types/node": "^17.0.35", "@types/semver": "^7.3.9", "@types/supertest": "^2.0.12", - "@typescript-eslint/eslint-plugin": "^5.23.0", - "@typescript-eslint/parser": "^5.23.0", + "@typescript-eslint/eslint-plugin": "^5.25.0", + "@typescript-eslint/parser": "^5.25.0", "autocannon": "^7.9.0", "cac": "^6.7.12", "cross-env": "^7.0.3", "cross-spawn": "^7.0.3", "esbuild": "0.14.3", - "eslint": "^8.15.0", + "eslint": "^8.16.0", "eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb-typescript": "^17.0.0", "eslint-import-resolver-typescript": "^2.7.1", "eslint-import-resolver-webpack": "^0.13.2", "eslint-plugin-import": "2.26.0", "eslint-plugin-jsx-a11y": "^6.5.1", - "eslint-plugin-react": "^7.29.4", + "eslint-plugin-react": "^7.30.0", "eslint-plugin-simple-import-sort": "7.0.0", "fs-extra": "^10.1.0", "globby": "11.1.0", diff --git a/packages/hydrooj/package.json b/packages/hydrooj/package.json index 5f106213..70887a04 100644 --- a/packages/hydrooj/package.json +++ b/packages/hydrooj/package.json @@ -12,7 +12,7 @@ }, "preferUnplugged": true, "dependencies": { - "@graphql-tools/schema": "^8.3.11", + "@graphql-tools/schema": "^8.3.13", "@hydrooj/utils": "workspace:*", "adm-zip": "0.5.5", "ajv": "^8.11.0", diff --git a/packages/ui-default/components/editor/index.ts b/packages/ui-default/components/editor/index.ts index 7e328687..a59ebc34 100644 --- a/packages/ui-default/components/editor/index.ts +++ b/packages/ui-default/components/editor/index.ts @@ -265,6 +265,8 @@ export default class Editor extends DOMAttachedObject { focus() { this.ensureValid(); + this.vditor?.focus(); + if (!this.editor || !this.model) return; this.editor.focus(); const range = this.model.getFullModelRange(); this.editor.setPosition({ lineNumber: range.endLineNumber, column: range.endColumn }); diff --git a/packages/ui-default/package.json b/packages/ui-default/package.json index 24977b72..99e95b96 100644 --- a/packages/ui-default/package.json +++ b/packages/ui-default/package.json @@ -1,6 +1,6 @@ { "name": "@hydrooj/ui-default", - "version": "4.37.10", + "version": "4.37.11", "author": "undefined ", "license": "AGPL-3.0", "main": "hydro.js", @@ -10,7 +10,7 @@ "lint": "eslint" }, "devDependencies": { - "@blueprintjs/core": "^4.3.1", + "@blueprintjs/core": "^4.3.2", "@fontsource/dm-mono": "^4.5.8", "@fontsource/fira-code": "^4.5.9", "@fontsource/inconsolata": "^4.5.6", @@ -43,11 +43,11 @@ "echarts": "^5.3.2", "emojis-keywords": "2.0.0", "emojis-list": "2.1.0", - "esbuild-loader": "^2.18.0", + "esbuild-loader": "^2.19.0", "fancy-log": "^2.0.0", "file-loader": "^6.2.0", "friendly-errors-webpack-plugin": "^1.7.0", - "graphiql": "1.8.9", + "graphiql": "1.8.10", "gulp": "^4.0.2", "gulp-cli": "^2.3.0", "gulp-iconfont": "^11.0.1", @@ -58,6 +58,7 @@ "jquery-scroll-lock": "^3.1.3", "jquery.easing": "^1.4.1", "jquery.transit": "^0.9.12", + "matchmedia-polyfill": "^0.3.2", "mini-css-extract-plugin": "^1.6.2", "moment": "^2.29.3", "monaco-editor": "^0.33.0", @@ -114,7 +115,7 @@ "fs-extra": "^10.1.0", "js-yaml": "^4.1.0", "jsesc": "^3.0.2", - "katex": "^0.15.3", + "katex": "^0.15.6", "lodash": "^4.17.21", "markdown-it": "^13.0.1", "markdown-it-anchor": "^8.6.4", diff --git a/packages/ui-default/polyfill.ts b/packages/ui-default/polyfill.ts index 142b1b46..cf95aff6 100644 --- a/packages/ui-default/polyfill.ts +++ b/packages/ui-default/polyfill.ts @@ -1,5 +1,6 @@ import queueMicrotask from 'queue-microtask'; import browserUpdate from 'browser-update'; +import 'matchmedia-polyfill'; window.queueMicrotask = queueMicrotask; browserUpdate({ @@ -9,3 +10,66 @@ browserUpdate({ insecure: true, api: 2022.03, }); + +// monaco-editor requires this polyfill +if (window.MediaQueryList) { + MediaQueryList.prototype.addEventListener = (k, listener) => { + MediaQueryList.prototype.addListener(listener); + }; +} +if (!(window.matchMedia('all').addListener || window.matchMedia('all').addEventListener)) { + const localMatchMedia = window.matchMedia; + const hasMediaQueries = localMatchMedia('only all').matches; + let isListening = false; + let timeoutID; + const queries = []; + const handleChange = function () { + clearTimeout(timeoutID); + timeoutID = setTimeout(() => { + for (let i = 0, il = queries.length; i < il; i++) { + const { mql } = queries[i]; + const listeners = queries[i].listeners || []; + const { matches } = localMatchMedia(mql.media); + if (matches !== mql.matches) { + mql.matches = matches; + for (let j = 0, jl = listeners.length; j < jl; j++) { + listeners[j].call(window, mql); + } + } + } + }, 30); + }; + window.matchMedia = function (media) { + const mql = localMatchMedia(media); + const listeners = []; + let index = 0; + if (!mql.addListener) { + mql.addListener = function (listener) { + if (!hasMediaQueries) return; + if (!isListening) { + isListening = true; + window.addEventListener('resize', handleChange, true); + } + if (index === 0) { + index = queries.push({ + mql, + listeners, + }); + } + listeners.push(listener); + }; + mql.removeListener = function (listener) { + for (let i = 0, il = listeners.length; i < il; i++) { + if (listeners[i] === listener) { + listeners.splice(i, 1); + } + } + }; + } + if (!mql.addEventListener) { + mql.addEventListener = (k, listener) => mql.addListener(listener); + mql.removeEventListener = (k, listener) => mql.removeListener(listener); + } + return mql; + }; +} diff --git a/packages/ui-default/templates/layout/html5.html b/packages/ui-default/templates/layout/html5.html index 67883ebc..a141ac16 100644 --- a/packages/ui-default/templates/layout/html5.html +++ b/packages/ui-default/templates/layout/html5.html @@ -42,7 +42,7 @@ var _htmlNode = document.documentElement; _htmlNode.className = _htmlNode.className.replace(' nojs', ' hasjs'); try { - import('data:text/javascript,');Object.fromEntries([]) + import('data:text/javascript,');Object.fromEntries([]);window.matchMedia('all').addEventListener('change',()=>{}); } catch(e) { const s = document.createElement('script'); s.async = false; diff --git a/packages/vjudge/package.json b/packages/vjudge/package.json index 9dd2e996..450b51d7 100644 --- a/packages/vjudge/package.json +++ b/packages/vjudge/package.json @@ -12,7 +12,7 @@ "chrome-finder": "^1.0.7", "jsdom": "^19.0.0", "lodash": "^4.17.21", - "puppeteer-core": "^14.1.0", + "puppeteer-core": "^14.1.1", "puppeteer-extra": "^3.2.3", "puppeteer-extra-plugin-portal": "^3.1.0", "puppeteer-extra-plugin-stealth": "^2.9.0",