From 76a8bf2834d8e0c2cefc37d17f001500d78a1e12 Mon Sep 17 00:00:00 2001 From: donteatfriedrice Date: Mon, 19 May 2025 04:53:56 +0000 Subject: [PATCH] fix(editor): flaky import notion html image unit test (#12354) ## Summary by CodeRabbit - **Chores** - Added a new development dependency to improve testing capabilities. - **Tests** - Refactored image handling tests to use enhanced HTTP request mocking, improving test reliability and maintainability. --- blocksuite/affine/all/package.json | 1 + .../adapters/notion-html.unit.spec.ts | 99 ++++++++++++------- yarn.lock | 9 +- 3 files changed, 71 insertions(+), 38 deletions(-) diff --git a/blocksuite/affine/all/package.json b/blocksuite/affine/all/package.json index 26e80b6784..7bf117b177 100644 --- a/blocksuite/affine/all/package.json +++ b/blocksuite/affine/all/package.json @@ -292,6 +292,7 @@ "version": "0.21.0", "devDependencies": { "@vanilla-extract/vite-plugin": "^5.0.0", + "msw": "^2.8.4", "vitest": "3.1.3" } } diff --git a/blocksuite/affine/all/src/__tests__/adapters/notion-html.unit.spec.ts b/blocksuite/affine/all/src/__tests__/adapters/notion-html.unit.spec.ts index ba3de2a32c..8dbd196aa2 100644 --- a/blocksuite/affine/all/src/__tests__/adapters/notion-html.unit.spec.ts +++ b/blocksuite/affine/all/src/__tests__/adapters/notion-html.unit.spec.ts @@ -1,11 +1,14 @@ import { DefaultTheme, NoteDisplayMode } from '@blocksuite/affine-model'; import { NotionHtmlAdapter } from '@blocksuite/affine-shared/adapters'; +import { DEFAULT_IMAGE_PROXY_ENDPOINT } from '@blocksuite/affine-shared/consts'; import { AssetsManager, type BlockSnapshot, MemoryBlobCRUD, } from '@blocksuite/store'; -import { describe, expect, test } from 'vitest'; +import { http, HttpResponse } from 'msw'; +import { setupServer } from 'msw/node'; +import { afterAll, afterEach, beforeAll, describe, expect, test } from 'vitest'; import { createJob } from '../utils/create-job.js'; import { getProvider } from '../utils/get-provider.js'; @@ -1195,43 +1198,71 @@ describe('notion html to snapshot', () => { expect(nanoidReplacement(rawBlockSnapshot)).toEqual(blockSnapshot); }); - test('image', async () => { - const html = `
-
-
-
`; + describe('image', () => { + const originalUrl = + 'https://raw.githubusercontent.com/toeverything/blocksuite/master/assets/logo.svg'; - const blockSnapshot: BlockSnapshot = { - type: 'block', - id: 'matchesReplaceMap[0]', - flavour: 'affine:note', - props: { - xywh: '[0,0,800,95]', - background: DefaultTheme.noteBackgrounColor, - index: 'a0', - hidden: false, - displayMode: NoteDisplayMode.DocAndEdgeless, - }, - children: [ - { - type: 'block', - id: 'matchesReplaceMap[1]', - flavour: 'affine:image', - props: { - sourceId: 'matchesReplaceMap[2]', + const imageProxy = DEFAULT_IMAGE_PROXY_ENDPOINT; + const imageUrl = `${imageProxy}?url=${encodeURIComponent(originalUrl)}`; + + // Mock the image request + const imageRequestHandlers = [ + http.get(imageUrl.toString(), async () => { + // Return a mock image blob + const mockImageBlob = new Blob(['mock image data'], { + type: 'image/svg+xml', + }); + return new HttpResponse(mockImageBlob, { + headers: { + 'Content-Type': 'image/svg+xml', }, - children: [], - }, - ], - }; + }); + }), + ]; - const adapter = new NotionHtmlAdapter(createJob(), provider); - const rawBlockSnapshot = await adapter.toBlockSnapshot({ - file: html, - assets: new AssetsManager({ blob: new MemoryBlobCRUD() }), + const server = setupServer(...imageRequestHandlers); + beforeAll(() => server.listen({ onUnhandledRequest: 'error' })); + afterAll(() => server.close()); + afterEach(() => server.resetHandlers()); + + test('network image resource', async () => { + const html = `
+
+
+
`; + + const blockSnapshot: BlockSnapshot = { + type: 'block', + id: 'matchesReplaceMap[0]', + flavour: 'affine:note', + props: { + xywh: '[0,0,800,95]', + background: DefaultTheme.noteBackgrounColor, + index: 'a0', + hidden: false, + displayMode: NoteDisplayMode.DocAndEdgeless, + }, + children: [ + { + type: 'block', + id: 'matchesReplaceMap[1]', + flavour: 'affine:image', + props: { + sourceId: 'matchesReplaceMap[2]', + }, + children: [], + }, + ], + }; + + const adapter = new NotionHtmlAdapter(createJob(), provider); + const rawBlockSnapshot = await adapter.toBlockSnapshot({ + file: html, + assets: new AssetsManager({ blob: new MemoryBlobCRUD() }), + }); + expect(nanoidReplacement(rawBlockSnapshot)).toEqual(blockSnapshot); }); - expect(nanoidReplacement(rawBlockSnapshot)).toEqual(blockSnapshot); }); test('bookmark', async () => { diff --git a/yarn.lock b/yarn.lock index 6c2d0d3af7..1a0f957956 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4193,6 +4193,7 @@ __metadata: "@blocksuite/store": "workspace:*" "@blocksuite/sync": "workspace:*" "@vanilla-extract/vite-plugin": "npm:^5.0.0" + msw: "npm:^2.8.4" rxjs: "npm:^7.8.1" vitest: "npm:3.1.3" languageName: unknown @@ -27098,9 +27099,9 @@ __metadata: languageName: node linkType: hard -"msw@npm:^2.6.8": - version: 2.8.2 - resolution: "msw@npm:2.8.2" +"msw@npm:^2.6.8, msw@npm:^2.8.4": + version: 2.8.4 + resolution: "msw@npm:2.8.4" dependencies: "@bundled-es-modules/cookie": "npm:^2.0.1" "@bundled-es-modules/statuses": "npm:^1.0.1" @@ -27127,7 +27128,7 @@ __metadata: optional: true bin: msw: cli/index.js - checksum: 10/7579a8dccb8cc8eb0f13d0bf3a232a3d50a478511d95bc2a4b70778e78ffa28fd0949a855fbceb6ec381bbf76f6331a6d36fcb4a3197ff5bf55d0f14a7f3b35c + checksum: 10/f94108a15dc64c37edd949cf1f321142940e3032367d977e79faab57fb3fd559988fadc1d491cb933441c23300796dd2a64fb7d886d537485f1e607d28a64536 languageName: node linkType: hard