Jayden/AFFiNE-Mirror
0
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-07-25 22:38:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

test: add test case for blocksuite editor (#1528)

Browse Source
This commit is contained in:
Himself65
2023-03-10 17:45:10 -06:00
committed by GitHub
parent 1c89841d6f
commit a795000363
19 changed files with 495 additions and 488 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/component/src/components/BlockSuiteEditor.tsx
-5
View File
@@ -1,5 +0,0 @@
import { Editor, EditorProps } from '@blocksuite/react/editor';
export type BlockSuiteEditorProps = EditorProps;
export const BlockSuiteEditor = (props: BlockSuiteEditorProps) => {
return <Editor {...props} />;
};
packages/component/src/components/BlockSuiteErrorBoundary.tsx
-59
View File
@@ -1,59 +0,0 @@
import { MigrationError } from '@blocksuite/global/error';
import React, { Component, ErrorInfo } from 'react';
export type BlockSuiteErrorBoundaryProps = React.PropsWithChildren;
type BlockSuiteError = MigrationError | Error;
interface BlockSuiteErrorBoundaryState {
error: BlockSuiteError | null;
}
export class BlockSuiteErrorBoundary extends Component<
BlockSuiteErrorBoundaryProps,
BlockSuiteErrorBoundaryState
> {
public state: BlockSuiteErrorBoundaryState = {
error: null,
};
public static getDerivedStateFromError(
error: BlockSuiteError
): BlockSuiteErrorBoundaryState {
return { error };
}
public componentDidCatch(error: BlockSuiteError, errorInfo: ErrorInfo) {
console.error('Uncaught error:', error, errorInfo);
}
public render() {
if (this.state.error) {
const isMigrationError = this.state.error instanceof MigrationError;
return (
<>
<h1>Sorry.. there was an error</h1>
{isMigrationError ? (
<>
<span> Migration error </span>
<span>
{' '}
Please open a ticket in{' '}
<a
target="_blank"
href="https://github.com/toeverything/blocksuite/issues"
rel="noreferrer"
>
BlockSuite Github Issue
</a>
</span>
</>
) : null}
</>
);
}
return this.props.children;
}
}
packages/component/src/stories/BlockSuiteEditor.stories.tsx
-70
View File
@@ -1,70 +0,0 @@
/* deepscan-disable USELESS_ARROW_FUNC_BIND */
import { builtInSchemas } from '@blocksuite/blocks/models';
import { Page, Workspace } from '@blocksuite/store';
import { Meta, Story } from '@storybook/react';
import { Suspense } from 'react';
import {
BlockSuiteEditor,
BlockSuiteEditorProps,
} from '../components/BlockSuiteEditor';
const workspace = new Workspace({
id: 'test',
providers: [],
isSSR: typeof window === 'undefined',
}).register(builtInSchemas);
export default {
title: 'BlockSuite/Editor',
component: BlockSuiteEditor,
} as Meta<BlockSuiteEditorProps>;
const Template: Story<BlockSuiteEditorProps> = args => (
<Suspense fallback="loading page">
<BlockSuiteEditor {...args} />
</Suspense>
);
const presetMarkdown = `This playground is designed to:
* 📝 Test basic editing experience.
* ⚙️ Serve as E2E test entry.
* 🔗 Demonstrate how BlockSuite reconciles real-time collaboration with [local-first](https://martin.kleppmann.com/papers/local-first.pdf) data ownership.
## Controlling Playground Data Source
You might initially enter this page with the \`?init\` URL param. This is the default (opt-in) setup that automatically loads this built-in article. Meanwhile, you'll connect to a random single-user room via a WebRTC provider by default. This is the "single-user mode" for local testing.
To test real-time collaboration, you can specify the room to join by adding the \`?room=foo\` config - Try opening this page with \`?room=foo\` in two different tabs and see what happens!
> Note that the second and subsequent users should not open the page with the \`?init\` param in this case. Also, due to the P2P nature of WebRTC, as long as there is at least one user connected to the room, the content inside the room will **always** exist.
If you are the only user in the room, your content will be lost after refresh. This is great for local debugging. But if you want local persistence, you can open this page with the \`?providers=indexeddb&room=foo\` config, then click the init button in the bottom-left corner to initialize this default content.
As a pro tip, you can combine multiple providers! For example, feel free to open this page with \`?providers=indexeddb,webrtc&room=hello\` params, and see if everything works as expected. Have fun!
For any feedback, please visit [BlockSuite issues](https://github.com/toeverything/blocksuite/issues) 📍`;
const pagePromise = new Promise<Page>(resolve => {
workspace.slots.pageAdded.once(pageId => {
const page = workspace.getPage(pageId) as Page;
pageOrPagePromise = page;
resolve(page);
});
workspace.createPage('0');
});
let pageOrPagePromise: Promise<Page> | Page = pagePromise;
export const Primary = Template.bind(undefined);
Primary.args = {
page: () => pageOrPagePromise,
onInit: async (page, editor) => {
const pageBlockId = page.addBlockByFlavour('affine:page', {
title: 'Welcome to BlockSuite playground',
});
page.addBlockByFlavour('affine:surface', {}, null);
const frameId = page.addBlockByFlavour('affine:frame', {}, pageBlockId);
await editor.clipboard.importMarkdown(presetMarkdown, frameId);
},
};
Primary.parameters = {
docs: {
source: {
code: 'Disabled for this story, see https://github.com/storybookjs/storybook/issues/11554',
},
},
};
packages/component/src/stories/BlockSuiteErrorBoundary.stories.tsx
-29
View File
@@ -1,29 +0,0 @@
/* deepscan-disable USELESS_ARROW_FUNC_BIND */
import { MigrationError } from '@blocksuite/global/error';
import { Meta, StoryFn } from '@storybook/react';
import {
BlockSuiteErrorBoundary,
BlockSuiteErrorBoundaryProps,
} from '../components/BlockSuiteErrorBoundary';
export default {
title: 'BlockSuite/ErrorBoundary',
component: BlockSuiteErrorBoundary,
} as Meta<BlockSuiteErrorBoundaryProps>;
const Template: StoryFn<BlockSuiteErrorBoundaryProps> = args => (
<BlockSuiteErrorBoundary {...args} />
);
export const ErrorComponent = () => {
throw new MigrationError('Something incorrect');
};
export const Primary = Template.bind(undefined);
Primary.args = {
children: [
<span key="1">There is no error</span>,
<ErrorComponent key="2" />,
],
};