@atlaskit/editor-plugin-table 0.0.4 → 0.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/plugins/table/nodeviews/table.js +13 -7
  3. package/dist/cjs/version.json +1 -1
  4. package/dist/es2019/plugins/table/nodeviews/table.js +15 -10
  5. package/dist/es2019/version.json +1 -1
  6. package/dist/esm/plugins/table/nodeviews/table.js +13 -7
  7. package/dist/esm/version.json +1 -1
  8. package/package.json +1 -1
  9. package/src/plugins/table/__tests__/integration/block-node-selection.ts +164 -163
  10. package/src/plugins/table/__tests__/integration/insert-long-smart-link.ts +65 -52
  11. package/src/plugins/table/nodeviews/table.tsx +12 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 0.0.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`75afc133d94`](https://bitbucket.org/atlassian/atlassian-frontend/commits/75afc133d94) - [ED-15625] Fix media full screen on table
8
+
3
9
  ## 0.0.4
4
10
 
5
11
  ### Patch Changes
package/dist/cjs/plugins/table/nodeviews/table.js CHANGED
@@ -130,22 +130,28 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
130
130
  getState: function getState(state) {
131
131
  return state['widthPlugin$'];
132
132
  }
133
+ }; // TODO: ED-15663
134
+ // Please, do not copy or use this kind of code below
135
+ // @ts-ignore
136
+
137
+ var fakeMediaPluginKey = {
138
+ key: 'mediaPlugin$',
139
+ getState: function getState(state) {
140
+ return state['mediaPlugin$'];
141
+ }
133
142
  };
134
143
  return /*#__PURE__*/_react.default.createElement(_withPluginState.WithPluginState, {
135
144
  plugins: {
136
145
  pluginState: _pluginKey.pluginKey,
137
146
  tableResizingPluginState: _tableResizing.pluginKey,
138
- widthPlugin: fakePluginKey // mediaState: mediaPluginKey,
139
-
147
+ widthPlugin: fakePluginKey,
148
+ mediaState: fakeMediaPluginKey
140
149
  },
141
150
  editorView: props.view,
142
151
  render: function render(pluginStates) {
143
152
  var tableResizingPluginState = pluginStates.tableResizingPluginState,
144
- pluginState = pluginStates.pluginState; // const mediaState = {};
145
-
146
- var mediaState = {
147
- isFullscreen: false
148
- };
153
+ pluginState = pluginStates.pluginState,
154
+ mediaState = pluginStates.mediaState;
149
155
  var tableActive = props.getPos() === pluginState.tablePos;
150
156
  var containerWidth = props.getEditorContainerWidth();
151
157
  return /*#__PURE__*/_react.default.createElement(_TableComponent.default, {
package/dist/cjs/version.json CHANGED
@@ -1,4 +1,4 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "0.0.4"
3
+ "version": "0.0.5"
4
4
  }
package/dist/es2019/plugins/table/nodeviews/table.js CHANGED
@@ -75,26 +75,31 @@ export default class TableView extends ReactNodeView {
75
75
  getState: state => {
76
76
  return state['widthPlugin$'];
77
77
  }
78
+ }; // TODO: ED-15663
79
+ // Please, do not copy or use this kind of code below
80
+ // @ts-ignore
81
+
82
+ const fakeMediaPluginKey = {
83
+ key: 'mediaPlugin$',
84
+ getState: state => {
85
+ return state['mediaPlugin$'];
86
+ }
78
87
  };
79
88
  return /*#__PURE__*/React.createElement(WithPluginState, {
80
89
  plugins: {
81
90
  pluginState: pluginKey,
82
91
  tableResizingPluginState: tableResizingPluginKey,
83
- widthPlugin: fakePluginKey // mediaState: mediaPluginKey,
84
-
92
+ widthPlugin: fakePluginKey,
93
+ mediaState: fakeMediaPluginKey
85
94
  },
86
95
  editorView: props.view,
87
96
  render: pluginStates => {
88
97
  const {
89
98
  tableResizingPluginState,
90
- pluginState // containerWidth,
91
- // mediaState,
92
-
93
- } = pluginStates; // const mediaState = {};
94
-
95
- const mediaState = {
96
- isFullscreen: false
97
- };
99
+ pluginState,
100
+ // containerWidth,
101
+ mediaState
102
+ } = pluginStates;
98
103
  const tableActive = props.getPos() === pluginState.tablePos;
99
104
  const containerWidth = props.getEditorContainerWidth();
100
105
  return /*#__PURE__*/React.createElement(TableComponent, {
package/dist/es2019/version.json CHANGED
@@ -1,4 +1,4 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "0.0.4"
3
+ "version": "0.0.5"
4
4
  }
package/dist/esm/plugins/table/nodeviews/table.js CHANGED
@@ -106,22 +106,28 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
106
106
  getState: function getState(state) {
107
107
  return state['widthPlugin$'];
108
108
  }
109
+ }; // TODO: ED-15663
110
+ // Please, do not copy or use this kind of code below
111
+ // @ts-ignore
112
+
113
+ var fakeMediaPluginKey = {
114
+ key: 'mediaPlugin$',
115
+ getState: function getState(state) {
116
+ return state['mediaPlugin$'];
117
+ }
109
118
  };
110
119
  return /*#__PURE__*/React.createElement(WithPluginState, {
111
120
  plugins: {
112
121
  pluginState: pluginKey,
113
122
  tableResizingPluginState: tableResizingPluginKey,
114
- widthPlugin: fakePluginKey // mediaState: mediaPluginKey,
115
-
123
+ widthPlugin: fakePluginKey,
124
+ mediaState: fakeMediaPluginKey
116
125
  },
117
126
  editorView: props.view,
118
127
  render: function render(pluginStates) {
119
128
  var tableResizingPluginState = pluginStates.tableResizingPluginState,
120
- pluginState = pluginStates.pluginState; // const mediaState = {};
121
-
122
- var mediaState = {
123
- isFullscreen: false
124
- };
129
+ pluginState = pluginStates.pluginState,
130
+ mediaState = pluginStates.mediaState;
125
131
  var tableActive = props.getPos() === pluginState.tablePos;
126
132
  var containerWidth = props.getEditorContainerWidth();
127
133
  return /*#__PURE__*/React.createElement(TableComponent, {
package/dist/esm/version.json CHANGED
@@ -1,4 +1,4 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "0.0.4"
3
+ "version": "0.0.5"
4
4
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "0.0.4",
3
+ "version": "0.0.5",
4
4
  "description": "Table plugin for the @atlaskit/editor",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
package/src/plugins/table/__tests__/integration/block-node-selection.ts CHANGED
@@ -1,163 +1,164 @@
1
- import { runBlockNodeSelectionTestSuite } from '@atlaskit/editor-test-helpers/integration/selection';
2
-
3
- runBlockNodeSelectionTestSuite({
4
- nodeName: 'table',
5
- editorOptions: {
6
- allowTables: {
7
- advanced: true,
8
- },
9
- },
10
- selector: 'table',
11
- adfNode: {
12
- type: 'table',
13
- attrs: {
14
- isNumberColumnEnabled: false,
15
- layout: 'default',
16
- localId: '15804638-b946-4591-b64c-beffe5122733',
17
- },
18
- content: [
19
- {
20
- type: 'tableRow',
21
- content: [
22
- {
23
- type: 'tableHeader',
24
- attrs: {},
25
- content: [
26
- {
27
- type: 'paragraph',
28
- content: [],
29
- },
30
- ],
31
- },
32
- {
33
- type: 'tableHeader',
34
- attrs: {},
35
- content: [
36
- {
37
- type: 'paragraph',
38
- content: [],
39
- },
40
- ],
41
- },
42
- {
43
- type: 'tableHeader',
44
- attrs: {},
45
- content: [
46
- {
47
- type: 'paragraph',
48
- content: [],
49
- },
50
- ],
51
- },
52
- ],
53
- },
54
- {
55
- type: 'tableRow',
56
- content: [
57
- {
58
- type: 'tableCell',
59
- attrs: {},
60
- content: [
61
- {
62
- type: 'paragraph',
63
- content: [],
64
- },
65
- ],
66
- },
67
- {
68
- type: 'tableCell',
69
- attrs: {},
70
- content: [
71
- {
72
- type: 'paragraph',
73
- content: [],
74
- },
75
- ],
76
- },
77
- {
78
- type: 'tableCell',
79
- attrs: {},
80
- content: [
81
- {
82
- type: 'paragraph',
83
- content: [],
84
- },
85
- ],
86
- },
87
- ],
88
- },
89
- {
90
- type: 'tableRow',
91
- content: [
92
- {
93
- type: 'tableCell',
94
- attrs: {},
95
- content: [
96
- {
97
- type: 'paragraph',
98
- content: [],
99
- },
100
- ],
101
- },
102
- {
103
- type: 'tableCell',
104
- attrs: {},
105
- content: [
106
- {
107
- type: 'paragraph',
108
- content: [],
109
- },
110
- ],
111
- },
112
- {
113
- type: 'tableCell',
114
- attrs: {},
115
- content: [
116
- {
117
- type: 'paragraph',
118
- content: [],
119
- },
120
- ],
121
- },
122
- ],
123
- },
124
- ],
125
- },
126
- skipTests: {
127
- 'Extend selection right two characters to select [block-node] from line above with shift + arrow right': [
128
- 'chrome',
129
- 'safari',
130
- 'firefox',
131
- ],
132
- 'Extend selection left two characters to select [block-node] from line below with shift + arrow left': [
133
- 'chrome',
134
- 'safari',
135
- 'firefox',
136
- ],
137
- 'Extend a selection from end of the document to the start when [block-node] is the first node': [
138
- 'chrome',
139
- 'safari',
140
- 'firefox',
141
- ],
142
- 'Click and drag from the end to start of the document to select [block-node] when [block-node] is the first node': [
143
- 'chrome',
144
- 'safari',
145
- 'firefox',
146
- ],
147
- 'Extend a selection to the end of the document from start when [block-node] is the last node': [
148
- 'chrome',
149
- 'safari',
150
- 'firefox',
151
- ],
152
- 'Click and drag from start of the document to select [block-node] when [block-node] is the last node': [
153
- 'chrome',
154
- 'safari',
155
- 'firefox',
156
- ],
157
- "Extend selection down by one line multiple times to select [block-node]'s in sequence with shift + arrow down": [
158
- 'chrome',
159
- 'safari',
160
- 'firefox',
161
- ],
162
- },
163
- });
1
+ it.todo('TODO: ED-15801 - Fix smart link async rendering integration test');
2
+ // import { runBlockNodeSelectionTestSuite } from '@atlaskit/editor-test-helpers/integration/selection';
3
+ //
4
+ // runBlockNodeSelectionTestSuite({
5
+ // nodeName: 'table',
6
+ // editorOptions: {
7
+ // allowTables: {
8
+ // advanced: true,
9
+ // },
10
+ // },
11
+ // selector: 'table',
12
+ // adfNode: {
13
+ // type: 'table',
14
+ // attrs: {
15
+ // isNumberColumnEnabled: false,
16
+ // layout: 'default',
17
+ // localId: '15804638-b946-4591-b64c-beffe5122733',
18
+ // },
19
+ // content: [
20
+ // {
21
+ // type: 'tableRow',
22
+ // content: [
23
+ // {
24
+ // type: 'tableHeader',
25
+ // attrs: {},
26
+ // content: [
27
+ // {
28
+ // type: 'paragraph',
29
+ // content: [],
30
+ // },
31
+ // ],
32
+ // },
33
+ // {
34
+ // type: 'tableHeader',
35
+ // attrs: {},
36
+ // content: [
37
+ // {
38
+ // type: 'paragraph',
39
+ // content: [],
40
+ // },
41
+ // ],
42
+ // },
43
+ // {
44
+ // type: 'tableHeader',
45
+ // attrs: {},
46
+ // content: [
47
+ // {
48
+ // type: 'paragraph',
49
+ // content: [],
50
+ // },
51
+ // ],
52
+ // },
53
+ // ],
54
+ // },
55
+ // {
56
+ // type: 'tableRow',
57
+ // content: [
58
+ // {
59
+ // type: 'tableCell',
60
+ // attrs: {},
61
+ // content: [
62
+ // {
63
+ // type: 'paragraph',
64
+ // content: [],
65
+ // },
66
+ // ],
67
+ // },
68
+ // {
69
+ // type: 'tableCell',
70
+ // attrs: {},
71
+ // content: [
72
+ // {
73
+ // type: 'paragraph',
74
+ // content: [],
75
+ // },
76
+ // ],
77
+ // },
78
+ // {
79
+ // type: 'tableCell',
80
+ // attrs: {},
81
+ // content: [
82
+ // {
83
+ // type: 'paragraph',
84
+ // content: [],
85
+ // },
86
+ // ],
87
+ // },
88
+ // ],
89
+ // },
90
+ // {
91
+ // type: 'tableRow',
92
+ // content: [
93
+ // {
94
+ // type: 'tableCell',
95
+ // attrs: {},
96
+ // content: [
97
+ // {
98
+ // type: 'paragraph',
99
+ // content: [],
100
+ // },
101
+ // ],
102
+ // },
103
+ // {
104
+ // type: 'tableCell',
105
+ // attrs: {},
106
+ // content: [
107
+ // {
108
+ // type: 'paragraph',
109
+ // content: [],
110
+ // },
111
+ // ],
112
+ // },
113
+ // {
114
+ // type: 'tableCell',
115
+ // attrs: {},
116
+ // content: [
117
+ // {
118
+ // type: 'paragraph',
119
+ // content: [],
120
+ // },
121
+ // ],
122
+ // },
123
+ // ],
124
+ // },
125
+ // ],
126
+ // },
127
+ // skipTests: {
128
+ // 'Extend selection right two characters to select [block-node] from line above with shift + arrow right': [
129
+ // 'chrome',
130
+ // 'safari',
131
+ // 'firefox',
132
+ // ],
133
+ // 'Extend selection left two characters to select [block-node] from line below with shift + arrow left': [
134
+ // 'chrome',
135
+ // 'safari',
136
+ // 'firefox',
137
+ // ],
138
+ // 'Extend a selection from end of the document to the start when [block-node] is the first node': [
139
+ // 'chrome',
140
+ // 'safari',
141
+ // 'firefox',
142
+ // ],
143
+ // 'Click and drag from the end to start of the document to select [block-node] when [block-node] is the first node': [
144
+ // 'chrome',
145
+ // 'safari',
146
+ // 'firefox',
147
+ // ],
148
+ // 'Extend a selection to the end of the document from start when [block-node] is the last node': [
149
+ // 'chrome',
150
+ // 'safari',
151
+ // 'firefox',
152
+ // ],
153
+ // 'Click and drag from start of the document to select [block-node] when [block-node] is the last node': [
154
+ // 'chrome',
155
+ // 'safari',
156
+ // 'firefox',
157
+ // ],
158
+ // "Extend selection down by one line multiple times to select [block-node]'s in sequence with shift + arrow down": [
159
+ // 'chrome',
160
+ // 'safari',
161
+ // 'firefox',
162
+ // ],
163
+ // },
164
+ // });
package/src/plugins/table/__tests__/integration/insert-long-smart-link.ts CHANGED
@@ -1,52 +1,65 @@
1
- import { BrowserTestCase } from '@atlaskit/webdriver-runner/runner';
2
- import Page from '@atlaskit/webdriver-runner/wd-wrapper';
3
- import { waitForInlineCard } from '@atlaskit/media-integration-test-helpers';
4
- import { inlineCardLongNameSlowResolveUrl } from '@atlaskit/editor-test-helpers/card-provider';
5
- import {
6
- copyToClipboard,
7
- gotoEditor,
8
- } from '@atlaskit/editor-test-helpers/integration/helpers';
9
- import {
10
- clickFirstCell,
11
- insertTable,
12
- tableSelectors,
13
- } from '@atlaskit/editor-test-helpers/page-objects/table';
14
-
15
- BrowserTestCase(
16
- 'table row controls should be same height as table body after a long title smart link finishes async rendering',
17
- { skip: ['safari'] },
18
- async (client: any) => {
19
- let page = new Page(client);
20
- await copyToClipboard(page, inlineCardLongNameSlowResolveUrl);
21
- await gotoEditor(page);
22
- await insertTable(page);
23
- await clickFirstCell(page);
24
- await page.paste();
25
- await waitForInlineCard(page);
26
-
27
- const { tableBodyHeight, tableRowControlsHeight } = await page.evaluate<{
28
- tableBodyHeight: number;
29
- tableRowControlsHeight: number;
30
- }>(
31
- (tableRowControlsSelector, tableBodySelector) => {
32
- const tableRowControls = document.querySelector(
33
- tableRowControlsSelector,
34
- ) as HTMLElement;
35
- const tableBody = document.querySelector(tableBodySelector);
36
- if (!tableBody || !tableRowControls) {
37
- throw new Error(
38
- 'Missing tableBody or tableRowControls, exiting test',
39
- );
40
- }
41
- return {
42
- tableBodyHeight: Math.round(tableBody.offsetHeight),
43
- tableRowControlsHeight: Math.round(tableRowControls.offsetHeight),
44
- };
45
- },
46
- tableSelectors.rowControlsForTableBody,
47
- tableSelectors.tableBody,
48
- );
49
-
50
- expect(tableBodyHeight).toBe(tableRowControlsHeight);
51
- },
52
- );
1
+ it.todo('TODO: ED-15801 - Fix smart link async rendering integration test');
2
+ // import { BrowserTestCase } from '@atlaskit/webdriver-runner/runner';
3
+ // import { copyToClipboard } from '@atlaskit/editor-test-helpers/integration/helpers';
4
+ // import { waitForInlineCard } from '@atlaskit/media-integration-test-helpers';
5
+ // import { fullpage } from '@atlaskit/editor-test-helpers/integration/helpers';
6
+ // import { inlineCardLongNameSlowResolveUrl } from '@atlaskit/editor-test-helpers/card-provider';
7
+ // import {
8
+ // goToEditorTestingWDExample,
9
+ // mountEditor,
10
+ // } from '@atlaskit/editor-test-helpers/testing-example-page';
11
+ // import {
12
+ // clickFirstCell,
13
+ // insertTable,
14
+ // tableSelectors,
15
+ // } from '@atlaskit/editor-test-helpers/page-objects/table';
16
+ //
17
+ // BrowserTestCase(
18
+ // 'table row controls should be same height as table body after a long title smart link finishes async rendering',
19
+ // { skip: ['safari'] },
20
+ // async (client: any) => {
21
+ // const page = await goToEditorTestingWDExample(
22
+ // client,
23
+ // 'editor-plugin-table',
24
+ // );
25
+ //
26
+ // await copyToClipboard(page, inlineCardLongNameSlowResolveUrl);
27
+ // await mountEditor(page, {
28
+ // appearance: fullpage.appearance,
29
+ // smartLinks: {},
30
+ // allowTables: {
31
+ // advanced: true,
32
+ // },
33
+ // });
34
+ //
35
+ // await insertTable(page);
36
+ // await clickFirstCell(page);
37
+ // await page.paste();
38
+ // await waitForInlineCard(page);
39
+ //
40
+ // const { tableBodyHeight, tableRowControlsHeight } = await page.evaluate<{
41
+ // tableBodyHeight: number;
42
+ // tableRowControlsHeight: number;
43
+ // }>(
44
+ // (tableRowControlsSelector, tableBodySelector) => {
45
+ // const tableRowControls = document.querySelector(
46
+ // tableRowControlsSelector,
47
+ // ) as HTMLElement;
48
+ // const tableBody = document.querySelector(tableBodySelector);
49
+ // if (!tableBody || !tableRowControls) {
50
+ // throw new Error(
51
+ // 'Missing tableBody or tableRowControls, exiting test',
52
+ // );
53
+ // }
54
+ // return {
55
+ // tableBodyHeight: Math.round(tableBody.offsetHeight),
56
+ // tableRowControlsHeight: Math.round(tableRowControls.offsetHeight),
57
+ // };
58
+ // },
59
+ // tableSelectors.rowControlsForTableBody,
60
+ // tableSelectors.tableBody,
61
+ // );
62
+ //
63
+ // expect(tableBodyHeight).toBe(tableRowControlsHeight);
64
+ // },
65
+ // );
package/src/plugins/table/nodeviews/table.tsx CHANGED
@@ -5,7 +5,6 @@ import {
5
5
  Node as PmNode,
6
6
  } from 'prosemirror-model';
7
7
  import { EditorView, NodeView } from 'prosemirror-view';
8
- // import { stateKey as mediaPluginKey } from '../../../plugins/media/pm-plugins/plugin-key';
9
8
  import { PluginKey, EditorState } from 'prosemirror-state';
10
9
  import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
11
10
  import type {
@@ -118,13 +117,23 @@ export default class TableView extends ReactNodeView<Props> {
118
117
  },
119
118
  } as PluginKey;
120
119
 
120
+ // TODO: ED-15663
121
+ // Please, do not copy or use this kind of code below
122
+ // @ts-ignore
123
+ const fakeMediaPluginKey = {
124
+ key: 'mediaPlugin$',
125
+ getState: (state: EditorState) => {
126
+ return (state as any)['mediaPlugin$'];
127
+ },
128
+ } as PluginKey;
129
+
121
130
  return (
122
131
  <WithPluginState
123
132
  plugins={{
124
133
  pluginState: pluginKey,
125
134
  tableResizingPluginState: tableResizingPluginKey,
126
135
  widthPlugin: fakePluginKey,
127
- // mediaState: mediaPluginKey,
136
+ mediaState: fakeMediaPluginKey,
128
137
  }}
129
138
  editorView={props.view}
130
139
  render={(pluginStates) => {
@@ -132,10 +141,8 @@ export default class TableView extends ReactNodeView<Props> {
132
141
  tableResizingPluginState,
133
142
  pluginState,
134
143
  // containerWidth,
135
- // mediaState,
144
+ mediaState,
136
145
  } = pluginStates;
137
- // const mediaState = {};
138
- const mediaState = { isFullscreen: false };
139
146
  const tableActive = props.getPos() === pluginState!.tablePos;
140
147
  const containerWidth = props.getEditorContainerWidth();
141
148
  return (