@atlaskit/editor-plugin-table 7.2.2 → 7.3.0

package/src/__tests__/unit/collab.ts

@@ -1,93 +0,0 @@
-import type { DocBuilder } from '@atlaskit/editor-common/types';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
-import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
-import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
-import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
-import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
-import { widthPlugin } from '@atlaskit/editor-plugin-width';
-import { removeColumnAt } from '@atlaskit/editor-tables/utils';
-// eslint-disable-next-line import/no-extraneous-dependencies
-import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  createProsemirrorEditorFactory,
-  Preset,
-} from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  doc,
-  p,
-  table,
-  td,
-  th,
-  tr,
-} from '@atlaskit/editor-test-helpers/doc-builder';
-
-import tablePlugin from '../../plugin';
-import { pluginKey as tablePluginKey } from '../../pm-plugins/plugin-key';
-import { setResizeHandlePos } from '../../pm-plugins/table-resizing/commands';
-import type { PluginConfig } from '../../types';
-
-const TABLE_LOCAL_ID = 'test-table-local-id';
-
-describe('Tables with Collab editing', () => {
-  const createEditor = createProsemirrorEditorFactory();
-  const tableOptions = {
-    allowNumberColumn: true,
-    allowHeaderRow: true,
-    allowHeaderColumn: true,
-    permittedLayouts: 'all',
-    allowColumnResizing: true,
-  } as PluginConfig;
-
-  const editor = (doc: DocBuilder) => {
-    return createEditor({
-      doc,
-      preset: new Preset<LightEditorPlugin>()
-        .add([featureFlagsPlugin, {}])
-        .add([analyticsPlugin, {}])
-        .add(contentInsertionPlugin)
-        .add(widthPlugin)
-        .add(guidelinePlugin)
-        .add(selectionPlugin)
-        .add([tablePlugin, { tableOptions }]),
-      pluginKey: tablePluginKey,
-    });
-  };
-
-  it('applies colwidths to cells and sets autosize to false', () => {
-    const { editorView: view } = editor(
-      doc(
-        table({ localId: TABLE_LOCAL_ID })(
-          tr(th()(p('{<>}1')), th()(p('2')), th()(p('3'))),
-          tr(td()(p('4')), td()(p('5')), td()(p('6'))),
-          tr(td()(p('7')), td()(p('8')), td()(p('9'))),
-        ),
-      ),
-    );
-
-    // Trigger table resizing mouse down handlers.
-    setResizeHandlePos(2)(view.state, view.dispatch);
-    const mousedownEvent = new MouseEvent('mousedown', { clientX: 50 });
-    view.dom.dispatchEvent(mousedownEvent);
-
-    // Simulate collab change, delete col.
-    const documentChangeTr = removeColumnAt(1)(view.state.tr);
-    view.updateState(view.state.apply(documentChangeTr));
-
-    // Trigger table resizing finish handlers
-    const mouseupEvent = new MouseEvent('mouseup', { clientX: 150 });
-    window.dispatchEvent(mouseupEvent);
-
-    expect(view.state.doc).toEqualDocument(
-      doc(
-        table({ localId: TABLE_LOCAL_ID })(
-          tr(th()(p('1')), th()(p('3'))),
-          tr(td()(p('4')), td()(p('6'))),
-          tr(td()(p('7')), td()(p('9'))),
-        ),
-      ),
-    );
-  });
-});

package/src/__tests__/unit/commands/go-to-next-cell.ts

@@ -1,173 +0,0 @@
-import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
-import type { DocBuilder } from '@atlaskit/editor-common/types';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
-import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
-import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
-import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
-import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
-import { widthPlugin } from '@atlaskit/editor-plugin-width';
-import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
-// eslint-disable-next-line import/no-extraneous-dependencies
-import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  createProsemirrorEditorFactory,
-  Preset,
-} from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  doc,
-  p,
-  table,
-  td,
-  tdCursor,
-  tdEmpty,
-  tr,
-} from '@atlaskit/editor-test-helpers/doc-builder';
-
-import { goToNextCell } from '../../../commands/go-to-next-cell';
-import tablePlugin from '../../../plugin';
-import { pluginKey } from '../../../pm-plugins/plugin-key';
-import type { TablePluginState } from '../../../types';
-
-const TABLE_LOCAL_ID = 'test-table-local-id';
-
-const tdNextFocus = td()(p('{nextFocus}'));
-
-describe('table plugin: goToNextCell', () => {
-  const editorAnalyticsAPIFake: EditorAnalyticsAPI = {
-    attachAnalyticsEvent: jest.fn().mockReturnValue(() => jest.fn()),
-    fireAnalyticsEvent: jest.fn(),
-  };
-  const createEditor = createProsemirrorEditorFactory();
-  const preset = new Preset<LightEditorPlugin>()
-    .add([featureFlagsPlugin, {}])
-    .add([analyticsPlugin, {}])
-    .add(contentInsertionPlugin)
-    .add(widthPlugin)
-    .add(guidelinePlugin)
-    .add(selectionPlugin)
-    .add(tablePlugin);
-  const editor = (doc: DocBuilder) =>
-    createEditor<TablePluginState, PluginKey, typeof preset>({
-      doc,
-      preset,
-      pluginKey,
-    });
-
-  it('should do nothing when focus is not on a table', () => {
-    const { editorView } = editor(doc(p()));
-    const {
-      state,
-      state: { doc: initialDoc },
-      dispatch,
-    } = editorView;
-
-    const returnValue = goToNextCell(editorAnalyticsAPIFake)(1)(
-      state,
-      dispatch,
-    );
-
-    expect(returnValue).toBeFalsy();
-    expect(editorView.state.doc).toEqual(initialDoc);
-  });
-
-  it('should tab to next cell if focus is in the middle', () => {
-    const { editorView, refs } = editor(
-      doc(
-        table({ localId: TABLE_LOCAL_ID })(
-          tr(tdEmpty, tdCursor, tdNextFocus),
-          tr(tdEmpty, tdEmpty, tdEmpty),
-        ),
-      ),
-    );
-    const { state, dispatch } = editorView;
-
-    const returnValue = goToNextCell(editorAnalyticsAPIFake)(1)(
-      state,
-      dispatch,
-    );
-
-    expect(returnValue).toBeTruthy();
-    expect(editorView.state.selection.$anchor.pos).toEqual(refs.nextFocus);
-  });
-
-  it('should reverse tab to previous cell if focus is in the middle', () => {
-    const { editorView, refs } = editor(
-      doc(
-        table({ localId: TABLE_LOCAL_ID })(
-          tr(tdNextFocus, tdCursor, tdEmpty),
-          tr(tdEmpty, tdEmpty, tdEmpty),
-        ),
-      ),
-    );
-    const { state, dispatch } = editorView;
-
-    const returnValue = goToNextCell(editorAnalyticsAPIFake)(-1)(
-      state,
-      dispatch,
-    );
-
-    expect(returnValue).toBeTruthy();
-    expect(editorView.state.selection.$anchor.pos).toEqual(refs.nextFocus);
-  });
-
-  it('should insert row at end of table when tabbed on last cell', () => {
-    const { editorView } = editor(
-      doc(
-        table({ localId: TABLE_LOCAL_ID })(
-          tr(tdEmpty, tdEmpty, tdEmpty),
-          tr(tdEmpty, tdEmpty, tdCursor),
-        ),
-      ),
-    );
-    const { state, dispatch } = editorView;
-
-    const expected = doc(
-      table({ localId: TABLE_LOCAL_ID })(
-        tr(tdEmpty, tdEmpty, tdEmpty),
-        tr(tdEmpty, tdEmpty, tdEmpty),
-        tr(tdNextFocus, tdEmpty, tdEmpty),
-      ),
-    )(state.schema);
-
-    const returnValue = goToNextCell(editorAnalyticsAPIFake)(1)(
-      state,
-      dispatch,
-    );
-
-    expect(returnValue).toBeTruthy();
-    expect(expected.eq(editorView.state.doc)).toBeTruthy();
-    expect(editorView.state.selection.$anchor.pos).toEqual(32);
-  });
-
-  it('should insert row at start of table when reverse tabbed on first cell', () => {
-    const { editorView } = editor(
-      doc(
-        table({ localId: TABLE_LOCAL_ID })(
-          tr(tdCursor, tdEmpty, tdEmpty),
-          tr(tdEmpty, tdEmpty, tdEmpty),
-        ),
-      ),
-    );
-    const { state, dispatch } = editorView;
-
-    const expected = doc(
-      table({ localId: TABLE_LOCAL_ID })(
-        tr(tdNextFocus, tdEmpty, tdEmpty),
-        tr(tdEmpty, tdEmpty, tdEmpty),
-        tr(tdEmpty, tdEmpty, tdEmpty),
-      ),
-    )(state.schema);
-
-    const returnValue = goToNextCell(editorAnalyticsAPIFake)(-1)(
-      state,
-      dispatch,
-    );
-
-    expect(returnValue).toBeTruthy();
-    expect(expected.eq(editorView.state.doc)).toBeTruthy();
-    expect(editorView.state.selection.$anchor.pos).toEqual(4);
-  });
-});

package/src/__tests__/unit/commands/insert.ts

@@ -1,137 +0,0 @@
-import type {
-  DocBuilder,
-  GetEditorContainerWidth,
-} from '@atlaskit/editor-common/types';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
-import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
-import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
-import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
-import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
-import { widthPlugin } from '@atlaskit/editor-plugin-width';
-import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
-// eslint-disable-next-line import/no-extraneous-dependencies
-import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  createProsemirrorEditorFactory,
-  Preset,
-} from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  doc,
-  p,
-  table,
-  td,
-  tdEmpty,
-  tr,
-} from '@atlaskit/editor-test-helpers/doc-builder';
-
-import { addColumnAt } from '../../../commands/insert';
-import tablePlugin from '../../../plugin';
-import { pluginKey } from '../../../pm-plugins/plugin-key';
-import type { TablePluginState } from '../../../types';
-
-const TABLE_LOCAL_ID = 'test-table-local-id';
-
-describe('table plugin: insert', () => {
-  describe('addColumnAt', () => {
-    // We override the body as the table resizing logic uses it via the width plugin
-    // to calculate if a table should overflow
-    const mockBodyOffsetWidth = 1000;
-    const getEditorContainerWidth: GetEditorContainerWidth = () => {
-      return {
-        width: mockBodyOffsetWidth,
-      };
-    };
-
-    const createEditor = createProsemirrorEditorFactory();
-
-    const preset = new Preset<LightEditorPlugin>()
-      .add([featureFlagsPlugin, {}])
-      .add([analyticsPlugin, {}])
-      .add(contentInsertionPlugin)
-      .add(widthPlugin)
-      .add(guidelinePlugin)
-      .add(selectionPlugin)
-      .add([
-        tablePlugin,
-        {
-          tableOptions: {},
-        },
-      ]);
-
-    const editor = (doc: DocBuilder) =>
-      createEditor<TablePluginState, PluginKey, typeof preset>({
-        doc,
-        preset,
-        pluginKey,
-      });
-
-    it('does scale cells in tables which are not overflowing', () => {
-      jest
-        .spyOn(HTMLElement.prototype, 'clientWidth', 'get')
-        .mockImplementationOnce(() => 760)
-        .mockImplementationOnce(() => 770);
-
-      const { editorView } = editor(
-        doc(
-          table({ localId: TABLE_LOCAL_ID })(
-            tr(
-              td({ colwidth: [230] })(p('')),
-              td({ colwidth: [230] })(p('')),
-              td({ colwidth: [230] })(p('')),
-            ),
-          ),
-        ),
-      );
-      const { state } = editorView;
-      const transaction = state.tr;
-      const lastTableCellNode =
-        transaction.doc.content.firstChild?.firstChild?.lastChild;
-
-      const updatedTransaction = addColumnAt(getEditorContainerWidth)(
-        2,
-        true,
-        editorView,
-      )(transaction);
-
-      const updatedLastTableCellNode =
-        updatedTransaction.doc.content.firstChild?.firstChild?.lastChild;
-
-      expect(updatedLastTableCellNode?.attrs.colwidth[0]).not.toBe(
-        lastTableCellNode?.attrs.colwidth[0],
-      );
-
-      jest.restoreAllMocks();
-    });
-
-    it('does not scale cells in tables which are overflowing', () => {
-      const { editorView } = editor(
-        doc(
-          table({ localId: TABLE_LOCAL_ID })(
-            tr(
-              td({ colwidth: [mockBodyOffsetWidth] })(p('')),
-              tdEmpty,
-              tdEmpty,
-            ),
-          ),
-        ),
-      );
-      const { state } = editorView;
-      const transaction = state.tr;
-
-      const updatedTransaction = addColumnAt(getEditorContainerWidth)(
-        2,
-        true,
-        editorView,
-      )(transaction);
-
-      const tablePMNode = updatedTransaction.doc.content.firstChild;
-      const tableRowNode = tablePMNode?.firstChild;
-      const firstTableCellNode = tableRowNode?.firstChild;
-
-      expect(firstTableCellNode?.attrs.colwidth[0]).toBe(mockBodyOffsetWidth);
-    });
-  });
-});

package/src/__tests__/unit/commands/misc.ts

@@ -1,185 +0,0 @@
-import type { DocBuilder } from '@atlaskit/editor-common/types';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
-import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
-import { decorationsPlugin } from '@atlaskit/editor-plugin-decorations';
-import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
-import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
-import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
-import { widthPlugin } from '@atlaskit/editor-plugin-width';
-import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { isColumnSelected } from '@atlaskit/editor-tables/utils';
-// eslint-disable-next-line import/no-extraneous-dependencies
-import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  createProsemirrorEditorFactory,
-  Preset,
-} from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
-// eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import {
-  doc,
-  p,
-  table,
-  td,
-  tdEmpty,
-  tr,
-} from '@atlaskit/editor-test-helpers/doc-builder';
-
-import { moveCursorBackward, selectColumn } from '../../../commands';
-import tablePlugin from '../../../plugin';
-import { getDecorations } from '../../../pm-plugins/decorations/plugin';
-import { getPluginState } from '../../../pm-plugins/plugin-factory';
-import { pluginKey } from '../../../pm-plugins/plugin-key';
-import type { TablePluginState } from '../../../types';
-import { TableDecorations } from '../../../types';
-
-describe('table plugin: commands', () => {
-  const createEditor = createProsemirrorEditorFactory();
-  const preset = new Preset<LightEditorPlugin>()
-    .add([featureFlagsPlugin, {}])
-    .add([analyticsPlugin, {}])
-    .add(decorationsPlugin)
-    .add(contentInsertionPlugin)
-    .add(widthPlugin)
-    .add(guidelinePlugin)
-    .add(selectionPlugin)
-    .add([
-      tablePlugin,
-      {
-        tableOptions: { allowHeaderColumn: true },
-      },
-    ]);
-  const editor = (doc: DocBuilder) =>
-    createEditor<TablePluginState, PluginKey, typeof preset>({
-      doc,
-      preset,
-      pluginKey,
-    });
-
-  describe('#selectColumn', () => {
-    it('should select a column and set targetCellPosition to point to the first cell', () => {
-      const { editorView } = editor(doc(table()(tr(tdEmpty, tdEmpty))));
-      const { state, dispatch } = editorView;
-      selectColumn(1)(state, dispatch);
-      const pluginState = getPluginState(editorView.state);
-      expect(pluginState.targetCellPosition).toEqual(6);
-      expect(isColumnSelected(1)(editorView.state.selection));
-    });
-
-    it('should create decorations to select the column', () => {
-      const { editorView } = editor(doc(table()(tr(tdEmpty, tdEmpty))));
-      const { state, dispatch } = editorView;
-      selectColumn(1)(state, dispatch);
-      const decorationSet = getDecorations(editorView.state);
-      const columnSelectedDecorations = decorationSet.find(
-        undefined,
-        undefined,
-        (spec) => spec.key.indexOf(TableDecorations.COLUMN_SELECTED) > -1,
-      );
-
-      expect(columnSelectedDecorations).toHaveLength(1);
-    });
-  });
-
-  describe('#moveCursorBackwards', () => {
-    describe(`press backspace in an empty paragraph`, () => {
-      describe(`paragraph is not last node in document`, () => {
-        it(`should delete the paragraph node and place the cursor inside the last table cell`, () => {
-          const { editorView } = editor(
-            doc(
-              table({ localId: 'testId' })(
-                tr(td({})(p()), td({})(p()), td({})(p())),
-              ),
-              p('{<>}'),
-              p(),
-            ),
-          );
-          const { state, dispatch } = editorView;
-          moveCursorBackward(state, dispatch);
-          const expectedDoc = doc(
-            table({ localId: 'testId' })(
-              tr(td({})(p()), td({})(p()), td({})(p('{<>}'))),
-            ),
-            p(),
-          );
-          expect(editorView.state).toEqualDocumentAndSelection(expectedDoc);
-        });
-      });
-
-      describe(`paragraph is the last node in document`, () => {
-        it(`should just place the cursor inside the last table cell`, () => {
-          const { editorView } = editor(
-            doc(
-              table({ localId: 'testId' })(
-                tr(td({})(p()), td({})(p()), td({})(p())),
-              ),
-              p('{<>}'),
-            ),
-          );
-          const { state, dispatch } = editorView;
-          moveCursorBackward(state, dispatch);
-          const expectedDoc = doc(
-            table({ localId: 'testId' })(
-              tr(td({})(p()), td({})(p()), td({})(p('{<>}'))),
-            ),
-            p(),
-          );
-          expect(editorView.state).toEqualDocumentAndSelection(expectedDoc);
-        });
-      });
-    });
-
-    describe(`press backspace in paragraph with content`, () => {
-      it(`should place cursor inside last table cell`, () => {
-        const editorParagraphEnd = editor(
-          doc(
-            table({ localId: 'testId' })(
-              tr(td({})(p()), td({})(p()), td({})(p())),
-            ),
-            p('{<>}hello there'),
-          ),
-        );
-        const editorViewParagraphEnd = editorParagraphEnd.editorView;
-        moveCursorBackward(
-          editorViewParagraphEnd.state,
-          editorViewParagraphEnd.dispatch,
-        );
-        const paragraphEndExpectedDoc = doc(
-          table({ localId: 'testId' })(
-            tr(td({})(p()), td({})(p()), td({})(p('{<>}'))),
-          ),
-          p('hello there'),
-        );
-        expect(editorViewParagraphEnd.state).toEqualDocumentAndSelection(
-          paragraphEndExpectedDoc,
-        );
-
-        const editorParagraph = editor(
-          doc(
-            table({ localId: 'testId' })(
-              tr(td({})(p()), td({})(p()), td({})(p())),
-            ),
-            p('{<>}hello there'),
-            p('hello there'),
-          ),
-        );
-        const editorViewParagraph = editorParagraph.editorView;
-        moveCursorBackward(
-          editorViewParagraph.state,
-          editorViewParagraph.dispatch,
-        );
-        const paragraphExpectedDoc = doc(
-          table({ localId: 'testId' })(
-            tr(td({})(p()), td({})(p()), td({})(p('{<>}'))),
-          ),
-          p('hello there'),
-          p('hello there'),
-        );
-        expect(editorViewParagraph.state).toEqualDocumentAndSelection(
-          paragraphExpectedDoc,
-        );
-      });
-    });
-  });
-});