From 56749422caa8cbef1761de55bab001d8162af72c Mon Sep 17 00:00:00 2001 From: neil Date: Fri, 7 Jul 2023 14:47:04 +0800 Subject: [PATCH 1/6] chore: setup e2e test tool --- .gitignore | 3 ++ package.json | 10 +++--- playwright.config.ts | 77 ++++++++++++++++++++++++++++++++++++++++++++ pnpm-lock.yaml | 74 ++++++++++++++++++++++++++---------------- 4 files changed, 132 insertions(+), 32 deletions(-) create mode 100644 playwright.config.ts diff --git a/.gitignore b/.gitignore index 07e7158..b596879 100644 --- a/.gitignore +++ b/.gitignore @@ -12,3 +12,6 @@ public/dist .idea .vscode + +tests/e2e-report +tests/e2e-results diff --git a/package.json b/package.json index 40db2e8..a679313 100644 --- a/package.json +++ b/package.json @@ -1,16 +1,16 @@ { "private": true, "scripts": { - "build": "turbo run build --filter=!./apps/*", - "build:app_demo": "pnpm --filter demo build", - "build:app_legacy": "pnpm --filter @gitee/tide-legacy build", - "build:nocache": "pnpm clear && turbo run build --force --filter=!./apps/*", + "build": "turbo run build --filter=@gitee*", + "build:demo": "pnpm --filter demo build", + "build:nocache": "pnpm clear && turbo run build --force --filter=@gitee*", "clear": "turbo run clear --force", "dev:demo": "pnpm --filter demo dev", "dev:legacy": "pnpm --filter @gitee/tide-legacy dev", "format": "prettier --write \"**/*.{ts,tsx,md}\"", "lint": "turbo run lint", "lint-staged": "lint-staged", + "test:e2e": "playwright test", "pages": "cd apps/demo/dist && git add --all && git commit -m \"Deploy demo on pages updated\" && git push origin demo-pages", "prepare": "husky install", "release": "pnpm build:nocache && changeset version && changeset publish" @@ -29,11 +29,13 @@ "@babel/preset-typescript": "^7.21.0", "@babel/runtime-corejs3": "^7.21.0", "@changesets/cli": "^2.26.0", + "@playwright/test": "^1.35.1", "@rollup/plugin-babel": "^6.0.3", "@rollup/plugin-commonjs": "^21.0.1", "@rollup/plugin-image": "^3.0.2", "@rollup/plugin-json": "^6.0.0", "@rollup/plugin-node-resolve": "^13.1.3", + "@types/node": "^18.13.0", "core-js": "3", "date-fns": "^2.29.3", "eslint": "^7.32.0", diff --git a/playwright.config.ts b/playwright.config.ts new file mode 100644 index 0000000..4f519dc --- /dev/null +++ b/playwright.config.ts @@ -0,0 +1,77 @@ +import { defineConfig, devices } from '@playwright/test'; +import { type } from 'node:os'; + +/** + * Read environment variables from file. + * https://github.com/motdotla/dotenv + */ +// require('dotenv').config(); + +const projects = [ + { + name: 'chromium', + use: { + ...devices['Desktop Chrome'], + permissions: ['clipboard-read', 'clipboard-write'], + launchOptions: { + // headless: false, + /** + * Enable scrollbars in headless mode. + */ + ignoreDefaultArgs: ['--hide-scrollbars'], + }, + }, + }, + { + name: 'firefox', + use: { + ...devices['Desktop Firefox'], + }, + }, +]; + +if (type() === 'Darwin') { + projects.push({ + name: 'webkit', + use: { + ...devices['Desktop Safari'], + }, + }); +} + +/** + * See https://playwright.dev/docs/test-configuration. + */ +export default defineConfig({ + testDir: './tests', + /* Run tests in files in parallel */ + fullyParallel: true, + /* Fail the build on CI if you accidentally left test.only in the source code. */ + forbidOnly: !!process.env.CI, + /* Retry on CI only */ + retries: process.env.CI ? 2 : 0, + /* Opt out of parallel tests on CI. */ + workers: process.env.CI ? 1 : undefined, + /* The output directory for files created during test execution. Defaults to /test-results. */ + outputDir: './tests/e2e-results', + /* Reporter to use. See https://playwright.dev/docs/test-reporters */ + reporter: [['html', { outputFolder: 'tests/e2e-report' }]], + /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ + use: { + /* Base URL to use in actions like `await page.goto('/')`. */ + // baseURL: 'http://127.0.0.1:3000', + + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + }, + + /* Configure projects for major browsers */ + projects, + + /* Run your local dev server before starting the tests */ + webServer: { + command: 'pnpm run dev:demo', + url: 'http://127.0.0.1:5173/', + reuseExistingServer: !process.env.CI, + }, +}); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1000d06..47ac3e8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -12,11 +12,13 @@ importers: '@babel/preset-typescript': ^7.21.0 '@babel/runtime-corejs3': ^7.21.0 '@changesets/cli': ^2.26.0 + '@playwright/test': ^1.35.1 '@rollup/plugin-babel': ^6.0.3 '@rollup/plugin-commonjs': ^21.0.1 '@rollup/plugin-image': ^3.0.2 '@rollup/plugin-json': ^6.0.0 '@rollup/plugin-node-resolve': ^13.1.3 + '@types/node': ^18.13.0 core-js: '3' date-fns: ^2.29.3 eslint: ^7.32.0 @@ -44,11 +46,13 @@ importers: '@babel/preset-typescript': 7.21.0_@babel+core@7.21.0 '@babel/runtime-corejs3': 7.21.0 '@changesets/cli': 2.26.0 + '@playwright/test': 1.35.1 '@rollup/plugin-babel': 6.0.3_4tnfxcmsyr7y5qv3uwkivwqysm '@rollup/plugin-commonjs': 21.1.0_rollup@2.79.1 '@rollup/plugin-image': 3.0.2_rollup@2.79.1 '@rollup/plugin-json': 6.0.0_rollup@2.79.1 '@rollup/plugin-node-resolve': 13.3.0_rollup@2.79.1 + '@types/node': 18.13.0 core-js: 3.29.0 date-fns: 2.29.3 eslint: 7.32.0 @@ -63,10 +67,10 @@ importers: rollup-plugin-delete: 2.0.0 rollup-plugin-dts: 4.2.3_zptcx3kz3uwp66hzhyyt545weq rollup-plugin-postcss: 4.0.2_postcss@8.4.20 - rollup-plugin-sourcemaps: 0.6.3_rollup@2.79.1 + rollup-plugin-sourcemaps: 0.6.3_swbnzyiizz6z6zxgy2pyd5bmv4 rollup-plugin-typescript2: 0.34.1_zptcx3kz3uwp66hzhyyt545weq rollup-plugin-visualizer: 5.8.3_rollup@2.79.1 - turbo: 1.10.6 + turbo: 1.10.7 apps/demo: specifiers: @@ -3277,6 +3281,17 @@ packages: '@nodelib/fs.scandir': 2.1.5 fastq: 1.13.0 + /@playwright/test/1.35.1: + resolution: {integrity: sha512-b5YoFe6J9exsMYg0pQAobNDR85T1nLumUYgUTtKm4d21iX2L7WqKq9dW8NGJ+2vX0etZd+Y7UeuqsxDXm9+5ZA==} + engines: {node: '>=16'} + hasBin: true + dependencies: + '@types/node': 18.13.0 + playwright-core: 1.35.1 + optionalDependencies: + fsevents: 2.3.2 + dev: true + /@popperjs/core/2.11.6: resolution: {integrity: sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==} dev: false @@ -3820,10 +3835,6 @@ packages: resolution: {integrity: sha512-J8xLz7q2OFulZ2cyGTLE1TbbZcjpno7FaN6zdJNrgAdrJ+DZzh/uFR6YrTb4C+nXakvud8Q4+rbhoIWlYQbUFQ==} dev: true - /@types/node/18.11.15: - resolution: {integrity: sha512-VkhBbVo2+2oozlkdHXLrb3zjsRkpdnaU2bXmX8Wgle3PUi569eLRaHGlgETQHR7lLL1w7GiG3h9SnePhxNDecw==} - dev: true - /@types/node/18.13.0: resolution: {integrity: sha512-gC3TazRzGoOnoKAhUx+Q0t8S9Tzs74z7m0ipwGpSqQrleP14hKxP4/JUeEQcD3W1/aIpnWl8pHowI7WokuZpXg==} dev: true @@ -3865,7 +3876,7 @@ packages: /@types/resolve/1.17.1: resolution: {integrity: sha512-yy7HuzQhj0dhGpD8RLXSZWEkLsV9ibvxvi6EiJ3bkqLAO1RGo0WbkWQiwpRlSFymTJRz0d3k5LM3kkx8ArDbLw==} dependencies: - '@types/node': 18.11.15 + '@types/node': 18.13.0 dev: true /@types/scheduler/0.16.2: @@ -6887,6 +6898,12 @@ packages: find-up: 4.1.0 dev: true + /playwright-core/1.35.1: + resolution: {integrity: sha512-pNXb6CQ7OqmGDRspEjlxE49w+4YtR6a3X6mT1hZXeJHWmsEz7SunmvZeiG/+y1yyMZdHnnn73WKYdtV1er0Xyg==} + engines: {node: '>=16'} + hasBin: true + dev: true + /postcss-calc/8.2.4_postcss@8.4.20: resolution: {integrity: sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==} peerDependencies: @@ -7820,7 +7837,7 @@ packages: - ts-node dev: true - /rollup-plugin-sourcemaps/0.6.3_rollup@2.79.1: + /rollup-plugin-sourcemaps/0.6.3_swbnzyiizz6z6zxgy2pyd5bmv4: resolution: {integrity: sha512-paFu+nT1xvuO1tPFYXGe+XnQvg4Hjqv/eIhG8i5EspfYYPBKL57X7iVbfv55aNVASg3dzWvES9dmWsL2KhfByw==} engines: {node: '>=10.0.0'} peerDependencies: @@ -7831,6 +7848,7 @@ packages: optional: true dependencies: '@rollup/pluginutils': 3.1.0_rollup@2.79.1 + '@types/node': 18.13.0 rollup: 2.79.1 source-map-resolve: 0.6.0 dev: true @@ -8384,65 +8402,65 @@ packages: yargs: 17.6.2 dev: true - /turbo-darwin-64/1.10.6: - resolution: {integrity: sha512-s2Gc7i9Ud+H9GDcrGJjPIyscJfzDGQ6il4Sl2snfvwngJs4/TaqKuBoX3HNt/7F4NiFRs7ZhlLV1/Yu9zGBRhw==} + /turbo-darwin-64/1.10.7: + resolution: {integrity: sha512-N2MNuhwrl6g7vGuz4y3fFG2aR1oCs0UZ5HKl8KSTn/VC2y2YIuLGedQ3OVbo0TfEvygAlF3QGAAKKtOCmGPNKA==} cpu: [x64] os: [darwin] requiresBuild: true dev: true optional: true - /turbo-darwin-arm64/1.10.6: - resolution: {integrity: sha512-tgl70t5PBLyRcNTdP9N6NjvdvQ5LUk8Z60JGUhBhnc+oCOdA4pltrDJNPyel3tQAXXt1dDpl8pp9vUrbwoVyGg==} + /turbo-darwin-arm64/1.10.7: + resolution: {integrity: sha512-WbJkvjU+6qkngp7K4EsswOriO3xrNQag7YEGRtfLoDdMTk4O4QTeU6sfg2dKfDsBpTidTvEDwgIYJhYVGzrz9Q==} cpu: [arm64] os: [darwin] requiresBuild: true dev: true optional: true - /turbo-linux-64/1.10.6: - resolution: {integrity: sha512-h7eyAA3xtAVpamcYJYUwe0xm0LWdbv7/I7QiM09AZ67TTNpyUgqW8giFN3h793BHEQ2Rcnk9FNkpIbjWBbyamg==} + /turbo-linux-64/1.10.7: + resolution: {integrity: sha512-x1CF2CDP1pDz/J8/B2T0hnmmOQI2+y11JGIzNP0KtwxDM7rmeg3DDTtDM/9PwGqfPotN9iVGgMiMvBuMFbsLhg==} cpu: [x64] os: [linux] requiresBuild: true dev: true optional: true - /turbo-linux-arm64/1.10.6: - resolution: {integrity: sha512-8cZhOeLqu3QZ27yLd6bw4FNaB8y5pLdWeRLJeiWHkIb/cptKnRKJFP+keBJzJi8ovaMqdBpabrxiBRN2lhau5Q==} + /turbo-linux-arm64/1.10.7: + resolution: {integrity: sha512-JtnBmaBSYbs7peJPkXzXxsRGSGBmBEIb6/kC8RRmyvPAMyqF8wIex0pttsI+9plghREiGPtRWv/lfQEPRlXnNQ==} cpu: [arm64] os: [linux] requiresBuild: true dev: true optional: true - /turbo-windows-64/1.10.6: - resolution: {integrity: sha512-qx5jcfCJodN1Mh0KtSVQau7pK8CxDvtif7+joPHI2HbQPAADgdUl0LHfA5tFHh6aWgfvhxbvIXqJd6v7Mqkj9g==} + /turbo-windows-64/1.10.7: + resolution: {integrity: sha512-7A/4CByoHdolWS8dg3DPm99owfu1aY/W0V0+KxFd0o2JQMTQtoBgIMSvZesXaWM57z3OLsietFivDLQPuzE75w==} cpu: [x64] os: [win32] requiresBuild: true dev: true optional: true - /turbo-windows-arm64/1.10.6: - resolution: {integrity: sha512-vTQaRG3/s2XTreOBr6J9HKFtjzusvwGQg0GtuW2+9Z7fizdzP8MuhaDbN6FhKHcWC81PQPD61TBIKTVTsYOEZg==} + /turbo-windows-arm64/1.10.7: + resolution: {integrity: sha512-D36K/3b6+hqm9IBAymnuVgyePktwQ+F0lSXr2B9JfAdFPBktSqGmp50JNC7pahxhnuCLj0Vdpe9RqfnJw5zATA==} cpu: [arm64] os: [win32] requiresBuild: true dev: true optional: true - /turbo/1.10.6: - resolution: {integrity: sha512-0/wbjw4HvmPP1abVWHTdeFRfCA9cn5oxCPP5bDixagLzvDgGWE3xfdlsyGmq779Ekr9vjtDPgC2Y4JlXEhyryw==} + /turbo/1.10.7: + resolution: {integrity: sha512-xm0MPM28TWx1e6TNC3wokfE5eaDqlfi0G24kmeHupDUZt5Wd0OzHFENEHMPqEaNKJ0I+AMObL6nbSZonZBV2HA==} hasBin: true requiresBuild: true optionalDependencies: - turbo-darwin-64: 1.10.6 - turbo-darwin-arm64: 1.10.6 - turbo-linux-64: 1.10.6 - turbo-linux-arm64: 1.10.6 - turbo-windows-64: 1.10.6 - turbo-windows-arm64: 1.10.6 + turbo-darwin-64: 1.10.7 + turbo-darwin-arm64: 1.10.7 + turbo-linux-64: 1.10.7 + turbo-linux-arm64: 1.10.7 + turbo-windows-64: 1.10.7 + turbo-windows-arm64: 1.10.7 dev: true /type-check/0.4.0: -- Gitee From 7a0a16b0d0a7a43114a15671d494f0616ae7fd44 Mon Sep 17 00:00:00 2001 From: neil Date: Fri, 7 Jul 2023 16:17:42 +0800 Subject: [PATCH 2/6] chore: add test data --- apps/demo/src/components/Editor/content.json | 1272 ++++++++++++++++++ apps/demo/src/index.less | 2 +- apps/demo/src/index.tsx | 37 +- package.json | 1 + 4 files changed, 1297 insertions(+), 15 deletions(-) create mode 100644 apps/demo/src/components/Editor/content.json diff --git a/apps/demo/src/components/Editor/content.json b/apps/demo/src/components/Editor/content.json new file mode 100644 index 0000000..94500c0 --- /dev/null +++ b/apps/demo/src/components/Editor/content.json @@ -0,0 +1,1272 @@ +{ + "type": "doc", + "content": [ + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 1 + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://gitee.com/oschina/tide", + "target": "_blank" + } + } + ], + "text": "Tide" + } + ] + }, + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "开箱即用、扩展性强、支持 Markdown 语法、基础功能完善的 React 富文本编辑器。" + } + ] + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "在线演示" + } + ] + }, + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://oschina.gitee.io/tide", + "target": "_blank" + } + } + ], + "text": "https://oschina.gitee.io/tide" + } + ] + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "示例代码" + } + ] + }, + { + "type": "bulletList", + "content": [ + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "./packages/editor/README.zh-CN.md", + "target": "_blank" + } + } + ], + "text": "基本" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "./apps/demo", + "target": "_blank" + } + } + ], + "text": "复杂" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "./apps/legacy", + "target": "_blank" + } + } + ], + "text": "真实项目" + } + ] + } + ] + } + ] + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "特性" + } + ] + }, + { + "type": "bulletList", + "content": [ + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "基于 JSON 格式存储" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "支持 Markdown 快捷语法" + } + ] + }, + { + "type": "bulletList", + "content": [ + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "标题" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "引用" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "代码块" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "表格" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "超链接" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "图片" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "分割线" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "粗体、斜体、删除线" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "无序列表、有序列表、任务列表" + } + ] + } + ] + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "支持粘贴 Markdown 文本" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "支持功能增强的 Table 表格" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "支持粘贴、拖拽图片" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "支持 Emoji 表情选择" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "内建菜单栏" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "支持多主题" + } + ] + } + ] + } + ] + }, + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + }, + { + "type": "table", + "content": [ + { + "type": "tableRow", + "content": [ + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "hello world" + } + ] + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "col" + } + ] + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + } + ] + }, + { + "type": "tableRow", + "content": [ + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "row" + } + ] + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + } + ] + }, + { + "type": "tableRow", + "content": [ + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + } + ] + }, + { + "type": "tableRow", + "content": [ + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + }, + { + "type": "tableCell", + "attrs": { + "colspan": 1, + "rowspan": 1, + "colwidth": [100] + }, + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + } + ] + } + ] + } + ] + }, + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + }, + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + } + }, + { + "type": "blockquote", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "图片" + } + ] + } + ] + }, + { + "type": "image", + "attrs": { + "src": "https://placehold.co/400", + "alt": "", + "title": "", + "width": 350, + "height": "auto", + "align": "left" + } + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "目录" + } + ] + }, + { + "type": "codeBlock", + "attrs": { + "language": null + }, + "content": [ + { + "type": "text", + "text": ".\n├── apps\n│ ├── demo # 演示项目，部署在 Pages 上，地址：https://oschina.gitee.io/tide\n│ └── legacy # 真实项目，Gitee 社区版正在使用，包名为 @gitee/tide-legacy\n├── presets # 提供 @、#、! 引用（mention）功能的预知 UI 和配置，\n│ # 主要 @gitee/tide-legacy 在使用\n├── docs # 文档（待完善），包括：如何贡献\n├── packages # 组织 monorepo 的包目录\n│ ├── editor # 开箱即用的编辑器基础包，包名为 @gitee/tide\n│ ├── starter-kit # 将常用的扩展包集成在一起，配合 @gitee/tide 包使用，提供开箱即用体验\n│ ├── common # 常用的工具类等\n│ ├── react # 提供编辑器的 React 封装，便于在 React 项目中使用\n│ ├── extension-* # extension- 开头的包，提供编辑器的扩展功能\n│ ├── tsconfig # 统一的 tsconfig 配置\n│ └── eslint-config-custom # 统一的 eslint 配置\n└── scripts # 提供简化开发流程的脚本等" + } + ] + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "构建和运行" + } + ] + }, + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "Tide 使用 " + }, + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://turbo.build/repo", + "target": "_blank" + } + } + ], + "text": "turborepo" + }, + { + "type": "text", + "text": " 来管理多个 npm 包的编译和分发，使用 " + }, + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://pnpm.io", + "target": "_blank" + } + } + ], + "text": "pnpm" + }, + { + "type": "text", + "text": " 来管理本地依赖。" + } + ] + }, + { + "type": "codeBlock", + "attrs": { + "language": "shell" + }, + "content": [ + { + "type": "text", + "text": "git clone https://gitee.com/oschina/tide.git\n\ncd tide\n\n# 安装依赖\npnpm i\n\n# 构建 packages\npnpm build\n\n# 运行 demo 方便开发，会自动打开浏览器\npnpm dev:demo --open" + } + ] + }, + { + "type": "blockquote", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "由于 monorepo 依赖关系复杂，暂不支持本地构建后通过 " + }, + { + "type": "text", + "marks": [ + { + "type": "code" + } + ], + "text": "npm link" + }, + { + "type": "text", + "text": "、" + }, + { + "type": "text", + "marks": [ + { + "type": "code" + } + ], + "text": "yarn link" + }, + { + "type": "text", + "text": " 和 " + }, + { + "type": "text", + "marks": [ + { + "type": "code" + } + ], + "text": "pnpm link --global" + }, + { + "type": "text", + "text": " 方式使用本地构建的版本。" + } + ] + } + ] + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "贡献" + } + ] + }, + { + "type": "bulletList", + "content": [ + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "提交 Bug 请使用 " + }, + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://gitee.com/oschina/tide/issues", + "target": "_blank" + } + } + ], + "text": "Issues" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "text": "贡献代码请使用 " + }, + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://gitee.com/oschina/tide/pulls", + "target": "_blank" + } + } + ], + "text": "Pull Request" + }, + { + "type": "text", + "text": "，创建 Pull Request 前请先阅读 " + }, + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "./docs/CONTRIBUTING.md", + "target": "_blank" + } + } + ], + "text": "CONTRIBUTING.md" + } + ] + } + ] + } + ] + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "谁在使用" + } + ] + }, + { + "type": "bulletList", + "content": [ + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://e.gitee.com", + "target": "_blank" + } + } + ], + "text": "Gitee 企业版" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://gitee.com", + "target": "_blank" + } + } + ], + "text": "Gitee 社区版" + } + ] + } + ] + } + ] + }, + { + "type": "heading", + "attrs": { + "indent": 0, + "textAlign": "left", + "level": 2 + }, + "content": [ + { + "type": "text", + "text": "感谢" + } + ] + }, + { + "type": "bulletList", + "content": [ + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://github.com/ueberdosis/tiptap", + "target": "_blank" + } + } + ], + "text": "Tiptap" + } + ] + } + ] + }, + { + "type": "listItem", + "content": [ + { + "type": "paragraph", + "attrs": { + "indent": 0, + "textAlign": "left" + }, + "content": [ + { + "type": "text", + "marks": [ + { + "type": "link", + "attrs": { + "href": "https://github.com/ProseMirror/prosemirror", + "target": "_blank" + } + } + ], + "text": "ProseMirror" + } + ] + } + ] + } + ] + } + ] +} diff --git a/apps/demo/src/index.less b/apps/demo/src/index.less index 88dd312..7550123 100644 --- a/apps/demo/src/index.less +++ b/apps/demo/src/index.less @@ -69,7 +69,7 @@ a:active { } &-editor-wrapper { - width: 50%; + flex:1; min-width: 0; display: flex; flex-direction: column; diff --git a/apps/demo/src/index.tsx b/apps/demo/src/index.tsx index 7ae249f..9d91149 100644 --- a/apps/demo/src/index.tsx +++ b/apps/demo/src/index.tsx @@ -11,15 +11,21 @@ import { mockFetchMemberMentionDebounced, mockImgUploader, } from './components/Editor/utils'; +import defaultContent from './components/Editor/content.json'; import '@gitee/tide/dist/style.css'; import 'highlight.js/styles/a11y-light.css'; import './index.less'; +const params = new URLSearchParams(window.location.search); +const isTest = params.get('test'); +const isFill = params.get('fill'); + console.log('BUILD_TIME：', __BUILD_TIME__); function App() { const editor = useEditor({ + content: isFill ? defaultContent : '', autofocus: true, extensions: [ StarterKit.configure({ @@ -61,20 +67,23 @@ function App() {
-
- - - Fork me on Gitee - -
+ + {isTest ? null : ( +
+ + + Fork me on Gitee + +
+ )} diff --git a/package.json b/package.json index a679313..828d48c 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "lint": "turbo run lint", "lint-staged": "lint-staged", "test:e2e": "playwright test", + "test-ui:e2e": "playwright test --ui", "pages": "cd apps/demo/dist && git add --all && git commit -m \"Deploy demo on pages updated\" && git push origin demo-pages", "prepare": "husky install", "release": "pnpm build:nocache && changeset version && changeset publish" -- Gitee From 23209d0078fd9b9c7f379648119f1ad823846001 Mon Sep 17 00:00:00 2001 From: neil Date: Fri, 7 Jul 2023 18:00:45 +0800 Subject: [PATCH 3/6] test: add table test case --- apps/demo/src/components/Editor/content.json | 1272 ------------------ apps/demo/src/index.tsx | 7 +- apps/demo/src/vite-env.d.ts | 4 + tests/e2e/create-helper.ts | 8 + tests/e2e/shortcut-keyboard.spec.ts | 39 + tests/tsconfig.json | 5 + 6 files changed, 59 insertions(+), 1276 deletions(-) delete mode 100644 apps/demo/src/components/Editor/content.json create mode 100644 tests/e2e/create-helper.ts create mode 100644 tests/e2e/shortcut-keyboard.spec.ts create mode 100644 tests/tsconfig.json diff --git a/apps/demo/src/components/Editor/content.json b/apps/demo/src/components/Editor/content.json deleted file mode 100644 index 94500c0..0000000 --- a/apps/demo/src/components/Editor/content.json +++ /dev/null @@ -1,1272 +0,0 @@ -{ - "type": "doc", - "content": [ - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 1 - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://gitee.com/oschina/tide", - "target": "_blank" - } - } - ], - "text": "Tide" - } - ] - }, - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "开箱即用、扩展性强、支持 Markdown 语法、基础功能完善的 React 富文本编辑器。" - } - ] - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "在线演示" - } - ] - }, - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://oschina.gitee.io/tide", - "target": "_blank" - } - } - ], - "text": "https://oschina.gitee.io/tide" - } - ] - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "示例代码" - } - ] - }, - { - "type": "bulletList", - "content": [ - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "./packages/editor/README.zh-CN.md", - "target": "_blank" - } - } - ], - "text": "基本" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "./apps/demo", - "target": "_blank" - } - } - ], - "text": "复杂" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "./apps/legacy", - "target": "_blank" - } - } - ], - "text": "真实项目" - } - ] - } - ] - } - ] - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "特性" - } - ] - }, - { - "type": "bulletList", - "content": [ - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "基于 JSON 格式存储" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "支持 Markdown 快捷语法" - } - ] - }, - { - "type": "bulletList", - "content": [ - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "标题" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "引用" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "代码块" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "表格" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "超链接" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "图片" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "分割线" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "粗体、斜体、删除线" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "无序列表、有序列表、任务列表" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "支持粘贴 Markdown 文本" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "支持功能增强的 Table 表格" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "支持粘贴、拖拽图片" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "支持 Emoji 表情选择" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "内建菜单栏" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "支持多主题" - } - ] - } - ] - } - ] - }, - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - }, - { - "type": "table", - "content": [ - { - "type": "tableRow", - "content": [ - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "hello world" - } - ] - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "col" - } - ] - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - } - ] - }, - { - "type": "tableRow", - "content": [ - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "row" - } - ] - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - } - ] - }, - { - "type": "tableRow", - "content": [ - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - } - ] - }, - { - "type": "tableRow", - "content": [ - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - }, - { - "type": "tableCell", - "attrs": { - "colspan": 1, - "rowspan": 1, - "colwidth": [100] - }, - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - } - ] - } - ] - } - ] - }, - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - }, - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - } - }, - { - "type": "blockquote", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "图片" - } - ] - } - ] - }, - { - "type": "image", - "attrs": { - "src": "https://placehold.co/400", - "alt": "", - "title": "", - "width": 350, - "height": "auto", - "align": "left" - } - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "目录" - } - ] - }, - { - "type": "codeBlock", - "attrs": { - "language": null - }, - "content": [ - { - "type": "text", - "text": ".\n├── apps\n│ ├── demo # 演示项目，部署在 Pages 上，地址：https://oschina.gitee.io/tide\n│ └── legacy # 真实项目，Gitee 社区版正在使用，包名为 @gitee/tide-legacy\n├── presets # 提供 @、#、! 引用（mention）功能的预知 UI 和配置，\n│ # 主要 @gitee/tide-legacy 在使用\n├── docs # 文档（待完善），包括：如何贡献\n├── packages # 组织 monorepo 的包目录\n│ ├── editor # 开箱即用的编辑器基础包，包名为 @gitee/tide\n│ ├── starter-kit # 将常用的扩展包集成在一起，配合 @gitee/tide 包使用，提供开箱即用体验\n│ ├── common # 常用的工具类等\n│ ├── react # 提供编辑器的 React 封装，便于在 React 项目中使用\n│ ├── extension-* # extension- 开头的包，提供编辑器的扩展功能\n│ ├── tsconfig # 统一的 tsconfig 配置\n│ └── eslint-config-custom # 统一的 eslint 配置\n└── scripts # 提供简化开发流程的脚本等" - } - ] - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "构建和运行" - } - ] - }, - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "Tide 使用 " - }, - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://turbo.build/repo", - "target": "_blank" - } - } - ], - "text": "turborepo" - }, - { - "type": "text", - "text": " 来管理多个 npm 包的编译和分发，使用 " - }, - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://pnpm.io", - "target": "_blank" - } - } - ], - "text": "pnpm" - }, - { - "type": "text", - "text": " 来管理本地依赖。" - } - ] - }, - { - "type": "codeBlock", - "attrs": { - "language": "shell" - }, - "content": [ - { - "type": "text", - "text": "git clone https://gitee.com/oschina/tide.git\n\ncd tide\n\n# 安装依赖\npnpm i\n\n# 构建 packages\npnpm build\n\n# 运行 demo 方便开发，会自动打开浏览器\npnpm dev:demo --open" - } - ] - }, - { - "type": "blockquote", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "由于 monorepo 依赖关系复杂，暂不支持本地构建后通过 " - }, - { - "type": "text", - "marks": [ - { - "type": "code" - } - ], - "text": "npm link" - }, - { - "type": "text", - "text": "、" - }, - { - "type": "text", - "marks": [ - { - "type": "code" - } - ], - "text": "yarn link" - }, - { - "type": "text", - "text": " 和 " - }, - { - "type": "text", - "marks": [ - { - "type": "code" - } - ], - "text": "pnpm link --global" - }, - { - "type": "text", - "text": " 方式使用本地构建的版本。" - } - ] - } - ] - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "贡献" - } - ] - }, - { - "type": "bulletList", - "content": [ - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "提交 Bug 请使用 " - }, - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://gitee.com/oschina/tide/issues", - "target": "_blank" - } - } - ], - "text": "Issues" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "text": "贡献代码请使用 " - }, - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://gitee.com/oschina/tide/pulls", - "target": "_blank" - } - } - ], - "text": "Pull Request" - }, - { - "type": "text", - "text": "，创建 Pull Request 前请先阅读 " - }, - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "./docs/CONTRIBUTING.md", - "target": "_blank" - } - } - ], - "text": "CONTRIBUTING.md" - } - ] - } - ] - } - ] - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "谁在使用" - } - ] - }, - { - "type": "bulletList", - "content": [ - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://e.gitee.com", - "target": "_blank" - } - } - ], - "text": "Gitee 企业版" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://gitee.com", - "target": "_blank" - } - } - ], - "text": "Gitee 社区版" - } - ] - } - ] - } - ] - }, - { - "type": "heading", - "attrs": { - "indent": 0, - "textAlign": "left", - "level": 2 - }, - "content": [ - { - "type": "text", - "text": "感谢" - } - ] - }, - { - "type": "bulletList", - "content": [ - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://github.com/ueberdosis/tiptap", - "target": "_blank" - } - } - ], - "text": "Tiptap" - } - ] - } - ] - }, - { - "type": "listItem", - "content": [ - { - "type": "paragraph", - "attrs": { - "indent": 0, - "textAlign": "left" - }, - "content": [ - { - "type": "text", - "marks": [ - { - "type": "link", - "attrs": { - "href": "https://github.com/ProseMirror/prosemirror", - "target": "_blank" - } - } - ], - "text": "ProseMirror" - } - ] - } - ] - } - ] - } - ] -} diff --git a/apps/demo/src/index.tsx b/apps/demo/src/index.tsx index 9d91149..5173b20 100644 --- a/apps/demo/src/index.tsx +++ b/apps/demo/src/index.tsx @@ -11,7 +11,6 @@ import { mockFetchMemberMentionDebounced, mockImgUploader, } from './components/Editor/utils'; -import defaultContent from './components/Editor/content.json'; import '@gitee/tide/dist/style.css'; import 'highlight.js/styles/a11y-light.css'; @@ -19,13 +18,10 @@ import './index.less'; const params = new URLSearchParams(window.location.search); const isTest = params.get('test'); -const isFill = params.get('fill'); - console.log('BUILD_TIME：', __BUILD_TIME__); function App() { const editor = useEditor({ - content: isFill ? defaultContent : '', autofocus: true, extensions: [ StarterKit.configure({ @@ -57,6 +53,9 @@ function App() { ), }); + // 方便进行 端到端测试 + window._editor = editor; + return (
diff --git a/apps/demo/src/vite-env.d.ts b/apps/demo/src/vite-env.d.ts index 142cad5..75f9e64 100644 --- a/apps/demo/src/vite-env.d.ts +++ b/apps/demo/src/vite-env.d.ts @@ -18,3 +18,7 @@ declare module 'lz-string' { } declare const __BUILD_TIME__: string; + +interface Window { + _editor: any; +} diff --git a/tests/e2e/create-helper.ts b/tests/e2e/create-helper.ts new file mode 100644 index 0000000..cdd5514 --- /dev/null +++ b/tests/e2e/create-helper.ts @@ -0,0 +1,8 @@ +import { Page } from '@playwright/test'; + +export async function createTable(page: Page) { + await page.locator('.tide-menu-bar__btn .icon-table-bold').click(); + await page + .locator('.tide-editor-table-grid > div:nth-child(4) > div:nth-child(4)') + .click(); +} diff --git a/tests/e2e/shortcut-keyboard.spec.ts b/tests/e2e/shortcut-keyboard.spec.ts new file mode 100644 index 0000000..ac258a5 --- /dev/null +++ b/tests/e2e/shortcut-keyboard.spec.ts @@ -0,0 +1,39 @@ +import { test, expect } from '@playwright/test'; +import { createTable } from './create-helper'; + +test.beforeEach(async ({ page }) => { + await page.goto('http://127.0.0.1:5173/?test=1'); + await createTable(page); +}); + +test.describe('table 快捷键', () => { + test('全选 table 并删除', async ({ page }) => { + await page.keyboard.insertText('this is cell'); + await page.getByRole('cell', { name: 'this is cell' }).click(); + await page.keyboard.press('Meta+A'); + await page.keyboard.press('Meta+A'); + await page.keyboard.press('Meta+A'); + await page.keyboard.press('Backspace'); + await expect(page.locator('.tide-content table')).toBeEmpty({ + timeout: 1000, + }); + }); + + test('table 内创建两级 list', async ({ page }) => { + await page.keyboard.insertText('-'); + await page.keyboard.press('Space'); + + await page.keyboard.insertText('list item1'); + await page.keyboard.press('Enter'); + await page.keyboard.insertText('list item2'); + await page.keyboard.press('Enter'); + await page.keyboard.press('Tab'); + await page.keyboard.insertText('list item2 sub item'); + + const item = await page + .getByRole('list') + .filter({ hasText: /^list item2 sub item$/ }); + + await expect(item).toContainText('list item2 sub item'); + }); +}); diff --git a/tests/tsconfig.json b/tests/tsconfig.json new file mode 100644 index 0000000..2f98042 --- /dev/null +++ b/tests/tsconfig.json @@ -0,0 +1,5 @@ +{ + "compilerOptions": { + "esModuleInterop": true + } +} -- Gitee From 3f01ef5025c60a06a57bc07ba94ac10a6c0beebc Mon Sep 17 00:00:00 2001 From: neil Date: Fri, 7 Jul 2023 18:04:51 +0800 Subject: [PATCH 4/6] chore: remove useless code --- apps/demo/src/index.tsx | 3 --- apps/demo/src/vite-env.d.ts | 4 ---- 2 files changed, 7 deletions(-) diff --git a/apps/demo/src/index.tsx b/apps/demo/src/index.tsx index 5173b20..8188eb8 100644 --- a/apps/demo/src/index.tsx +++ b/apps/demo/src/index.tsx @@ -53,9 +53,6 @@ function App() { ), }); - // 方便进行 端到端测试 - window._editor = editor; - return (
diff --git a/apps/demo/src/vite-env.d.ts b/apps/demo/src/vite-env.d.ts index 75f9e64..142cad5 100644 --- a/apps/demo/src/vite-env.d.ts +++ b/apps/demo/src/vite-env.d.ts @@ -18,7 +18,3 @@ declare module 'lz-string' { } declare const __BUILD_TIME__: string; - -interface Window { - _editor: any; -} -- Gitee From 900a1b48c637b619a9d0ff4fc6e35ea64d368c0f Mon Sep 17 00:00:00 2001 From: neil Date: Fri, 7 Jul 2023 18:46:29 +0800 Subject: [PATCH 5/6] test: optimization test --- tests/e2e/shortcut-keyboard.spec.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/tests/e2e/shortcut-keyboard.spec.ts b/tests/e2e/shortcut-keyboard.spec.ts index ac258a5..d9a0b58 100644 --- a/tests/e2e/shortcut-keyboard.spec.ts +++ b/tests/e2e/shortcut-keyboard.spec.ts @@ -7,19 +7,19 @@ test.beforeEach(async ({ page }) => { }); test.describe('table 快捷键', () => { - test('全选 table 并删除', async ({ page }) => { + test('table 全选并删除', async ({ page }) => { await page.keyboard.insertText('this is cell'); await page.getByRole('cell', { name: 'this is cell' }).click(); await page.keyboard.press('Meta+A'); await page.keyboard.press('Meta+A'); await page.keyboard.press('Meta+A'); await page.keyboard.press('Backspace'); - await expect(page.locator('.tide-content table')).toBeEmpty({ - timeout: 1000, - }); + + const table = page.getByRole('table'); + await expect(table).toHaveCount(0); }); - test('table 内创建两级 list', async ({ page }) => { + test('table 内使用 Tab 创建两级 list', async ({ page }) => { await page.keyboard.insertText('-'); await page.keyboard.press('Space'); @@ -30,7 +30,7 @@ test.describe('table 快捷键', () => { await page.keyboard.press('Tab'); await page.keyboard.insertText('list item2 sub item'); - const item = await page + const item = page .getByRole('list') .filter({ hasText: /^list item2 sub item$/ }); -- Gitee From 736ffc42f37f01589c9c2d688c41007d15589f5d Mon Sep 17 00:00:00 2001 From: neil Date: Tue, 11 Jul 2023 10:35:59 +0800 Subject: [PATCH 6/6] =?UTF-8?q?docs:=20=E8=B4=A1=E7=8C=AE=E5=86=85?= =?UTF-8?q?=E5=AE=B9=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/CONTRIBUTING.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/CONTRIBUTING.md b/docs/CONTRIBUTING.md index 7104c9d..43f6ed0 100644 --- a/docs/CONTRIBUTING.md +++ b/docs/CONTRIBUTING.md @@ -19,7 +19,7 @@ pnpm dev:demo ## 部署 pages -以下脚本执行一次就行，使用 git worktree 将 Pages 部署分支挂载为子目录： +使用 git worktree 将子目录挂载为 Pages 部署分支： ```shell git checkout -b demo-pages origin/demo-pages @@ -30,6 +30,6 @@ git worktree add apps/demo/dist demo-pages ## 构建并发布 ```shell -pnpm build:app_demo +pnpm build:demo pnpm pages ``` -- Gitee