@atlaskit/editor-plugin-table 2.12.4 → 2.12.6

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-plugin-table
 
+## 2.12.6
+
+### Patch Changes
+
+- [`1f6e908f2bd`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1f6e908f2bd) - Workaround invalid getPos error occuring for TableComponent
+
+## 2.12.5
+
+### Patch Changes
+
+- [`1da71810c5d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1da71810c5d) - [Regression] Fix Invalid getPos issue happening for Table nodeviews
+
 ## 2.12.4
 
 ### Patch Changes

package/dist/cjs/plugins/table/nodeviews/TableComponent.js

@@ -415,7 +415,19 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           visibility: visible ? 'visible' : 'hidden'
         };
       });
-      var isNested = (0, _utils4.isTableNested)(view.state, getPos());
+
+      /**
+       *  ED-19838
+       *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+       *  before CR6 lands in production
+       */
+      var tablePos;
+      try {
+        tablePos = getPos ? getPos() : undefined;
+      } catch (e) {
+        tablePos = undefined;
+      }
+      var isNested = (0, _utils4.isTableNested)(view.state, tablePos);
       return /*#__PURE__*/_react.default.createElement(_TableContainer.TableContainer, {
         className: (0, _classnames2.default)(_types.TableCssClassName.TABLE_CONTAINER, (_classnames = {}, (0, _defineProperty3.default)(_classnames, _types.TableCssClassName.WITH_CONTROLS, allowControls && tableActive), (0, _defineProperty3.default)(_classnames, _types.TableCssClassName.TABLE_STICKY, this.state.stickyHeader && hasHeaderRow), (0, _defineProperty3.default)(_classnames, _types.TableCssClassName.HOVERED_DELETE_BUTTON, isInDanger), (0, _defineProperty3.default)(_classnames, _types.TableCssClassName.TABLE_SELECTED, (0, _utils2.isTableSelected)(view.state.selection)), _classnames)),
         editorView: view,

package/dist/cjs/plugins/table/nodeviews/table.js

@@ -153,7 +153,19 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
           var containerWidth = props.getEditorContainerWidth();
           var isTableResizing = tableWidthPluginState === null || tableWidthPluginState === void 0 ? void 0 : tableWidthPluginState.resizing;
           var isResizing = Boolean((tableResizingPluginState === null || tableResizingPluginState === void 0 ? void 0 : tableResizingPluginState.dragging) || isTableResizing);
-          var tableActive = props.getPos() === pluginState.tablePos && !isTableResizing;
+
+          /**
+           *  ED-19810
+           *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+           *  directly to confluence since this bug is now in production.
+           */
+          var tablePos;
+          try {
+            tablePos = props.getPos ? props.getPos() : undefined;
+          } catch (e) {
+            tablePos = undefined;
+          }
+          var tableActive = tablePos === pluginState.tablePos && !isTableResizing;
           return /*#__PURE__*/_react.default.createElement(_TableComponent.default, {
             view: props.view,
             allowColumnResizing: props.allowColumnResizing,

package/dist/es2019/plugins/table/nodeviews/TableComponent.js

@@ -407,7 +407,19 @@ class TableComponent extends React.Component {
     const shadowStyle = memoizeOne(visible => ({
       visibility: visible ? 'visible' : 'hidden'
     }));
-    const isNested = isTableNested(view.state, getPos());
+
+    /**
+     *  ED-19838
+     *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+     *  before CR6 lands in production
+     */
+    let tablePos;
+    try {
+      tablePos = getPos ? getPos() : undefined;
+    } catch (e) {
+      tablePos = undefined;
+    }
+    const isNested = isTableNested(view.state, tablePos);
     return /*#__PURE__*/React.createElement(TableContainer, {
       className: classnames(ClassName.TABLE_CONTAINER, {
         [ClassName.WITH_CONTROLS]: allowControls && tableActive,

package/dist/es2019/plugins/table/nodeviews/table.js

@@ -125,7 +125,19 @@ export default class TableView extends ReactNodeView {
         const containerWidth = props.getEditorContainerWidth();
         const isTableResizing = tableWidthPluginState === null || tableWidthPluginState === void 0 ? void 0 : tableWidthPluginState.resizing;
         const isResizing = Boolean((tableResizingPluginState === null || tableResizingPluginState === void 0 ? void 0 : tableResizingPluginState.dragging) || isTableResizing);
-        const tableActive = props.getPos() === pluginState.tablePos && !isTableResizing;
+
+        /**
+         *  ED-19810
+         *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+         *  directly to confluence since this bug is now in production.
+         */
+        let tablePos;
+        try {
+          tablePos = props.getPos ? props.getPos() : undefined;
+        } catch (e) {
+          tablePos = undefined;
+        }
+        const tableActive = tablePos === pluginState.tablePos && !isTableResizing;
         return /*#__PURE__*/React.createElement(TableComponent, {
           view: props.view,
           allowColumnResizing: props.allowColumnResizing,

package/dist/esm/plugins/table/nodeviews/TableComponent.js

@@ -408,7 +408,19 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           visibility: visible ? 'visible' : 'hidden'
         };
       });
-      var isNested = isTableNested(view.state, getPos());
+
+      /**
+       *  ED-19838
+       *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+       *  before CR6 lands in production
+       */
+      var tablePos;
+      try {
+        tablePos = getPos ? getPos() : undefined;
+      } catch (e) {
+        tablePos = undefined;
+      }
+      var isNested = isTableNested(view.state, tablePos);
       return /*#__PURE__*/React.createElement(TableContainer, {
         className: classnames(ClassName.TABLE_CONTAINER, (_classnames = {}, _defineProperty(_classnames, ClassName.WITH_CONTROLS, allowControls && tableActive), _defineProperty(_classnames, ClassName.TABLE_STICKY, this.state.stickyHeader && hasHeaderRow), _defineProperty(_classnames, ClassName.HOVERED_DELETE_BUTTON, isInDanger), _defineProperty(_classnames, ClassName.TABLE_SELECTED, isTableSelected(view.state.selection)), _classnames)),
         editorView: view,

package/dist/esm/plugins/table/nodeviews/table.js

@@ -146,7 +146,19 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
           var containerWidth = props.getEditorContainerWidth();
           var isTableResizing = tableWidthPluginState === null || tableWidthPluginState === void 0 ? void 0 : tableWidthPluginState.resizing;
           var isResizing = Boolean((tableResizingPluginState === null || tableResizingPluginState === void 0 ? void 0 : tableResizingPluginState.dragging) || isTableResizing);
-          var tableActive = props.getPos() === pluginState.tablePos && !isTableResizing;
+
+          /**
+           *  ED-19810
+           *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+           *  directly to confluence since this bug is now in production.
+           */
+          var tablePos;
+          try {
+            tablePos = props.getPos ? props.getPos() : undefined;
+          } catch (e) {
+            tablePos = undefined;
+          }
+          var tableActive = tablePos === pluginState.tablePos && !isTableResizing;
           return /*#__PURE__*/React.createElement(TableComponent, {
             view: props.view,
             allowColumnResizing: props.allowColumnResizing,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "2.12.4",
+  "version": "2.12.6",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -37,8 +37,8 @@
     "@atlaskit/editor-tables": "^2.3.0",
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/platform-feature-flags": "^0.2.1",
-    "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.18.0",
+    "@atlaskit/theme": "^12.6.0",
+    "@atlaskit/tokens": "^1.19.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",

package/src/plugins/table/nodeviews/TableComponent.tsx

@@ -342,7 +342,19 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
         ({ visibility: visible ? 'visible' : 'hidden' } as CSSProperties),
     );
 
-    const isNested = isTableNested(view.state, getPos());
+    /**
+     *  ED-19838
+     *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+     *  before CR6 lands in production
+     */
+    let tablePos: number | undefined;
+    try {
+      tablePos = getPos ? getPos() : undefined;
+    } catch (e) {
+      tablePos = undefined;
+    }
+
+    const isNested = isTableNested(view.state, tablePos);
 
     return (
       <TableContainer

package/src/plugins/table/nodeviews/table.tsx

@@ -221,8 +221,21 @@ export default class TableView extends ReactNodeView<Props> {
           const isResizing = Boolean(
             tableResizingPluginState?.dragging || isTableResizing,
           );
+
+          /**
+           *  ED-19810
+           *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
+           *  directly to confluence since this bug is now in production.
+           */
+          let tablePos: number | undefined;
+          try {
+            tablePos = props.getPos ? props.getPos() : undefined;
+          } catch (e) {
+            tablePos = undefined;
+          }
+
           const tableActive =
-            props.getPos() === pluginState!.tablePos && !isTableResizing;
+            tablePos === pluginState!.tablePos && !isTableResizing;
 
           return (
             <TableComponent

package/src/__tests__/integration/__snapshots__/change-date-inside-table.ts.snap

@@ -1,173 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`change-date-inside-table.ts: Change date inside table 1`] = `
-Object {
-  "content": Array [
-    Object {
-      "attrs": Object {
-        "__autoSize": false,
-        "isNumberColumnEnabled": false,
-        "layout": "default",
-        "localId": "abc-123",
-      },
-      "content": Array [
-        Object {
-          "content": Array [
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "content": Array [
-                    Object {
-                      "attrs": Object {
-                        "timestamp": "1502841600000",
-                      },
-                      "type": "date",
-                    },
-                    Object {
-                      "text": " ",
-                      "type": "text",
-                    },
-                  ],
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableHeader",
-            },
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableHeader",
-            },
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableHeader",
-            },
-          ],
-          "type": "tableRow",
-        },
-        Object {
-          "content": Array [
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableCell",
-            },
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableCell",
-            },
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableCell",
-            },
-          ],
-          "type": "tableRow",
-        },
-        Object {
-          "content": Array [
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableCell",
-            },
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableCell",
-            },
-            Object {
-              "attrs": Object {
-                "background": null,
-                "colspan": 1,
-                "colwidth": null,
-                "rowspan": 1,
-              },
-              "content": Array [
-                Object {
-                  "type": "paragraph",
-                },
-              ],
-              "type": "tableCell",
-            },
-          ],
-          "type": "tableRow",
-        },
-      ],
-      "type": "table",
-    },
-  ],
-  "type": "doc",
-}
-`;

package/src/__tests__/integration/change-date-inside-table.ts

@@ -1,46 +0,0 @@
-import {
-  editable,
-  fullpage,
-  getDocFromElement,
-  insertBlockMenuItem,
-  quickInsert,
-} from '@atlaskit/editor-test-helpers/integration/helpers';
-import {
-  goToEditorTestingWDExample,
-  mountEditor,
-} from '@atlaskit/editor-test-helpers/testing-example-page';
-import { BrowserTestCase } from '@atlaskit/webdriver-runner/runner';
-
-const calendar = '[aria-label="calendar"]';
-const nextDate = 'button[aria-selected=true] + button';
-
-BrowserTestCase(
-  'change-date-inside-table.ts: Change date inside table',
-  {},
-  async (client: any, testName: string) => {
-    const page = await goToEditorTestingWDExample(
-      client,
-      'editor-plugin-table',
-    );
-    await mountEditor(page, {
-      appearance: fullpage.appearance,
-      allowDate: true,
-      allowTables: {
-        advanced: true,
-      },
-    });
-
-    await page.click(editable);
-
-    // Insert table
-    await quickInsert(page, 'Table');
-    // Insert Date
-    await insertBlockMenuItem(page, 'Date');
-    expect(await page.isExisting(calendar)).toBe(true);
-
-    await page.click(nextDate);
-
-    const doc = await page.$eval(editable, getDocFromElement);
-    expect(doc).toMatchCustomDocSnapshot(testName);
-  },
-);