diff --git a/entry_types/scrolled/package/spec/frontend/features/sectionPadding-spec.js b/entry_types/scrolled/package/spec/frontend/features/sectionPadding-spec.js
index 94060f391a..9db4c5b6c2 100644
--- a/entry_types/scrolled/package/spec/frontend/features/sectionPadding-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/features/sectionPadding-spec.js
@@ -1,4 +1,4 @@
-import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects';
+import {renderEntry, usePageObjects} from 'support/pageObjects';
import {act} from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
@@ -9,7 +9,7 @@ jest.mock('frontend/usePortraitOrientation');
jest.mock('frontend/useMotifAreaState');
describe('section padding', () => {
- useInlineEditingPageObjects();
+ usePageObjects();
it('does not suppress top padding by default', () => {
const {getSectionByPermaId} = renderEntry({
@@ -83,51 +83,6 @@ describe('section padding', () => {
expect(getSectionByPermaId(6).hasSuppressedBottomPadding()).toBe(true);
});
- it('forces padding below full width element if section is selected', () => {
- const {getSectionByPermaId} = renderEntry({
- seed: {
- sections: [{id: 5, permaId: 6}],
- contentElements: [{sectionId: 5, configuration: {width: 3}}]
- }
- });
-
- const section = getSectionByPermaId(6);
- section.select();
-
- expect(section.hasForcedPadding()).toBe(true);
- });
-
- it('forces padding below full width element if element is selected', () => {
- const {getSectionByPermaId, getContentElementByTestId} = renderEntry({
- seed: {
- sections: [{id: 5, permaId: 6}],
- contentElements: [{
- sectionId: 5,
- typeName: 'withTestId',
- configuration: {testId: 10, width: 3}
- }]
- }
- });
-
- getContentElementByTestId(10).select();
-
- expect(getSectionByPermaId(6).hasForcedPadding()).toBe(true);
- });
-
- it('does not force padding if padding is selected', () => {
- const {getSectionByPermaId} = renderEntry({
- seed: {
- sections: [{id: 5, permaId: 6}],
- contentElements: [{sectionId: 5, configuration: {width: 3}}]
- }
- });
-
- const section = getSectionByPermaId(6);
- section.selectPadding('bottom');
-
- expect(section.hasForcedPadding()).toBe(false);
- });
-
it('does not set inline padding styles when no paddingTop/paddingBottom set', () => {
const {getSectionByPermaId} = renderEntry({
seed: {
diff --git a/entry_types/scrolled/package/spec/frontend/features/useContentElementEditorCommandSubscription-spec.js b/entry_types/scrolled/package/spec/frontend/features/useContentElementEditorCommandSubscription-spec.js
new file mode 100644
index 0000000000..fb3838db38
--- /dev/null
+++ b/entry_types/scrolled/package/spec/frontend/features/useContentElementEditorCommandSubscription-spec.js
@@ -0,0 +1,23 @@
+import React from 'react';
+
+import {useContentElementEditorCommandSubscription} from 'pageflow-scrolled/frontend';
+import {renderEntry, usePageObjects} from 'support/pageObjects';
+
+import '@testing-library/jest-dom/extend-expect';
+
+describe('useContentElementEditorCommandSubscription', () => {
+ usePageObjects();
+
+ it('is noop', () => {
+ function Test() {
+ useContentElementEditorCommandSubscription(() => {});
+ return null;
+ }
+
+ expect(() =>
+ renderEntry({
+ contentElement: {ui: }
+ })
+ ).not.toThrow();
+ });
+});
diff --git a/entry_types/scrolled/package/spec/frontend/features/useContentElementEditorState-spec.js b/entry_types/scrolled/package/spec/frontend/features/useContentElementEditorState-spec.js
new file mode 100644
index 0000000000..420c09b992
--- /dev/null
+++ b/entry_types/scrolled/package/spec/frontend/features/useContentElementEditorState-spec.js
@@ -0,0 +1,63 @@
+import React, {useEffect} from 'react';
+import {fireEvent} from '@testing-library/react';
+
+import {useContentElementEditorState} from 'pageflow-scrolled/frontend';
+import {renderEntry, usePageObjects} from 'support/pageObjects';
+
+import '@testing-library/jest-dom/extend-expect';
+
+describe('useContentElementEditorState', () => {
+ usePageObjects();
+
+ it('returns false for isSelected', () => {
+ function Test() {
+ const {isSelected} = useContentElementEditorState();
+
+ return (
+
+ {isSelected ? 'Selected' : 'Unselected'}
+
+ );
+ }
+
+ const {getByTestId} = renderEntry({
+ contentElement: {ui: }
+ });
+ fireEvent.click(getByTestId('contentElement'));
+
+ expect(getByTestId('contentElement')).toHaveTextContent('Unselected');
+ });
+
+ it('returns false for isEditable', () => {
+ function Test() {
+ const {isEditable} = useContentElementEditorState();
+
+ return (
+
+ {isEditable ? 'Edit me' : 'Read only'}
+
+ );
+ }
+
+ const {getByTestId} = renderEntry({
+ contentElement: {ui: }
+ });
+
+ expect(getByTestId('contentElement')).toHaveTextContent('Read only');
+ });
+
+ it('provides noop setTransientState function', () => {
+ function Test() {
+ const {setTransientState} = useContentElementEditorState();
+
+ useEffect(() => setTransientState({some: 'state'}));
+ return null;
+ }
+
+ expect(() =>
+ renderEntry({
+ contentElement: {ui: }
+ })
+ ).not.toThrow();
+ });
+});
diff --git a/entry_types/scrolled/package/spec/frontend/features/editorCommentBadges-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/commentBadges-spec.js
similarity index 96%
rename from entry_types/scrolled/package/spec/frontend/features/editorCommentBadges-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/commentBadges-spec.js
index 20bc4741ba..b9276af769 100644
--- a/entry_types/scrolled/package/spec/frontend/features/editorCommentBadges-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/commentBadges-spec.js
@@ -2,11 +2,11 @@ import '@testing-library/jest-dom/extend-expect';
import {act, waitFor} from '@testing-library/react';
import {features} from 'pageflow/frontend';
-import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects';
+import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects/inlineEditing';
import badgeStyles from 'review/Badge.module.css';
-describe('editor comment badges', () => {
+describe('inline editing comment badges', () => {
useInlineEditingPageObjects();
beforeEach(() => {
diff --git a/entry_types/scrolled/package/spec/frontend/features/contentElementSelection-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/contentElementSelection-spec.js
similarity index 97%
rename from entry_types/scrolled/package/spec/frontend/features/contentElementSelection-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/contentElementSelection-spec.js
index 85b1f21023..99e8897919 100644
--- a/entry_types/scrolled/package/spec/frontend/features/contentElementSelection-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/contentElementSelection-spec.js
@@ -2,12 +2,12 @@ import React from 'react';
import {frontend} from 'frontend';
import {features} from 'pageflow/frontend';
-import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects';
+import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects/inlineEditing';
import {changeLocationHash} from 'support/changeLocationHash';
import '@testing-library/jest-dom/extend-expect'
import {act, fireEvent, waitFor} from '@testing-library/react';
-describe('content element selection', () => {
+describe('inline editing content element selection', () => {
useInlineEditingPageObjects();
beforeEach(() => {
diff --git a/entry_types/scrolled/package/spec/frontend/inlineEditing/features/forcedSectionPadding-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/forcedSectionPadding-spec.js
new file mode 100644
index 0000000000..d7de9de9b2
--- /dev/null
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/forcedSectionPadding-spec.js
@@ -0,0 +1,52 @@
+import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects/inlineEditing';
+
+import '@testing-library/jest-dom/extend-expect';
+
+describe('inline editing forced section padding', () => {
+ useInlineEditingPageObjects();
+
+ it('forces padding below full width element if section is selected', () => {
+ const {getSectionByPermaId} = renderEntry({
+ seed: {
+ sections: [{id: 5, permaId: 6}],
+ contentElements: [{sectionId: 5, configuration: {width: 3}}]
+ }
+ });
+
+ const section = getSectionByPermaId(6);
+ section.select();
+
+ expect(section.hasForcedPadding()).toBe(true);
+ });
+
+ it('forces padding below full width element if element is selected', () => {
+ const {getSectionByPermaId, getContentElementByTestId} = renderEntry({
+ seed: {
+ sections: [{id: 5, permaId: 6}],
+ contentElements: [{
+ sectionId: 5,
+ typeName: 'withTestId',
+ configuration: {testId: 10, width: 3}
+ }]
+ }
+ });
+
+ getContentElementByTestId(10).select();
+
+ expect(getSectionByPermaId(6).hasForcedPadding()).toBe(true);
+ });
+
+ it('does not force padding if padding is selected', () => {
+ const {getSectionByPermaId} = renderEntry({
+ seed: {
+ sections: [{id: 5, permaId: 6}],
+ contentElements: [{sectionId: 5, configuration: {width: 3}}]
+ }
+ });
+
+ const section = getSectionByPermaId(6);
+ section.selectPadding('bottom');
+
+ expect(section.hasForcedPadding()).toBe(false);
+ });
+});
diff --git a/entry_types/scrolled/package/spec/frontend/features/insertContentElementMessage-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/insertContentElementMessage-spec.js
similarity index 92%
rename from entry_types/scrolled/package/spec/frontend/features/insertContentElementMessage-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/insertContentElementMessage-spec.js
index 2a39169f91..49558a3eca 100644
--- a/entry_types/scrolled/package/spec/frontend/features/insertContentElementMessage-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/insertContentElementMessage-spec.js
@@ -1,7 +1,7 @@
-import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects';
+import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects/inlineEditing';
import '@testing-library/jest-dom/extend-expect'
-describe('INSERT_CONTENT_ELEMENT message', () => {
+describe('inline editing INSERT_CONTENT_ELEMENT message', () => {
useInlineEditingPageObjects();
diff --git a/entry_types/scrolled/package/spec/frontend/features/marginIndicator-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/marginIndicator-spec.js
similarity index 98%
rename from entry_types/scrolled/package/spec/frontend/features/marginIndicator-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/marginIndicator-spec.js
index 3e70c3b6fb..f9cf11d858 100644
--- a/entry_types/scrolled/package/spec/frontend/features/marginIndicator-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/marginIndicator-spec.js
@@ -1,7 +1,7 @@
-import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects';
+import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects/inlineEditing';
import '@testing-library/jest-dom/extend-expect';
-describe('MarginIndicator', () => {
+describe('inline editing MarginIndicator', () => {
useInlineEditingPageObjects();
it('displays scale translation for top margin when element is selected', () => {
diff --git a/entry_types/scrolled/package/spec/frontend/features/moveContentElementMessage-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/moveContentElementMessage-spec.js
similarity index 95%
rename from entry_types/scrolled/package/spec/frontend/features/moveContentElementMessage-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/moveContentElementMessage-spec.js
index e171d3a928..6541524035 100644
--- a/entry_types/scrolled/package/spec/frontend/features/moveContentElementMessage-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/moveContentElementMessage-spec.js
@@ -1,7 +1,7 @@
-import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects';
+import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects/inlineEditing';
import '@testing-library/jest-dom/extend-expect'
-describe('MOVE_CONTENT_ELEMENT message', () => {
+describe('inline editing MOVE_CONTENT_ELEMENT message', () => {
useInlineEditingPageObjects();
diff --git a/entry_types/scrolled/package/spec/frontend/features/paddingIndicator-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/paddingIndicator-spec.js
similarity index 98%
rename from entry_types/scrolled/package/spec/frontend/features/paddingIndicator-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/paddingIndicator-spec.js
index d48ac557bf..8fa263cff3 100644
--- a/entry_types/scrolled/package/spec/frontend/features/paddingIndicator-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/paddingIndicator-spec.js
@@ -1,10 +1,10 @@
-import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects';
+import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects/inlineEditing';
import {useMotifAreaState} from 'frontend/useMotifAreaState';
import '@testing-library/jest-dom/extend-expect';
jest.mock('frontend/useMotifAreaState');
-describe('PaddingIndicator', () => {
+describe('inline editing PaddingIndicator', () => {
useInlineEditingPageObjects();
it('displays scale translation for top padding when section is selected', () => {
diff --git a/entry_types/scrolled/package/spec/frontend/features/scrollPointMessages-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/scrollPointMessages-spec.js
similarity index 96%
rename from entry_types/scrolled/package/spec/frontend/features/scrollPointMessages-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/scrollPointMessages-spec.js
index 10c74d6af1..fbdc651cf2 100644
--- a/entry_types/scrolled/package/spec/frontend/features/scrollPointMessages-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/scrollPointMessages-spec.js
@@ -1,8 +1,8 @@
-import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects';
+import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects/inlineEditing';
import {asyncHandlingOf} from 'support/asyncHandlingOf';
-describe('scroll point messages', () => {
+describe('inline editing scroll point messages', () => {
useInlineEditingPageObjects();
beforeEach(() => {
diff --git a/entry_types/scrolled/package/spec/frontend/features/selectedMessage-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/selectedMessage-spec.js
similarity index 98%
rename from entry_types/scrolled/package/spec/frontend/features/selectedMessage-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/selectedMessage-spec.js
index 44171d4a46..41f220067f 100644
--- a/entry_types/scrolled/package/spec/frontend/features/selectedMessage-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/selectedMessage-spec.js
@@ -2,11 +2,11 @@ import React from 'react';
import {frontend, WidgetSelectionRect} from 'frontend';
import {features} from 'pageflow/frontend';
-import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects';
+import {useInlineEditingPageObjects, renderEntry} from 'support/pageObjects/inlineEditing';
import {act, fireEvent, waitFor} from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect'
-describe('SELECTED message', () => {
+describe('inline editing SELECTED message', () => {
useInlineEditingPageObjects();
diff --git a/entry_types/scrolled/package/spec/frontend/features/useContentElementConfigurationUpdate-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementConfigurationUpdate-spec.js
similarity index 96%
rename from entry_types/scrolled/package/spec/frontend/features/useContentElementConfigurationUpdate-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementConfigurationUpdate-spec.js
index e4034ad6f4..ba1401f1cd 100644
--- a/entry_types/scrolled/package/spec/frontend/features/useContentElementConfigurationUpdate-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementConfigurationUpdate-spec.js
@@ -2,10 +2,10 @@ import React, {useEffect} from 'react';
import {frontend, useContentElementConfigurationUpdate} from 'frontend';
-import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects';
+import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects/inlineEditing';
import '@testing-library/jest-dom/extend-expect'
-describe('useContentElementConfigurationUpdate', () => {
+describe('inline editing useContentElementConfigurationUpdate', () => {
useInlineEditingPageObjects();
diff --git a/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementEditorCommandSubscription-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementEditorCommandSubscription-spec.js
new file mode 100644
index 0000000000..4e03d2ea67
--- /dev/null
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementEditorCommandSubscription-spec.js
@@ -0,0 +1,36 @@
+import React from 'react';
+
+import {useContentElementEditorCommandSubscription} from 'pageflow-scrolled/frontend';
+import {tick} from 'support';
+import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects/inlineEditing';
+
+import '@testing-library/jest-dom/extend-expect';
+
+describe('inline editing useContentElementEditorCommandSubscription', () => {
+ useInlineEditingPageObjects();
+
+ it('invokes callback for content element commands sent via post message', async () => {
+ const callback = jest.fn();
+
+ function Test() {
+ useContentElementEditorCommandSubscription(callback);
+ return null;
+ }
+
+ renderEntry({
+ contentElement: {ui: }
+ });
+
+ const command = {type: 'SOME_COMMAND'};
+ window.postMessage({
+ type: 'CONTENT_ELEMENT_EDITOR_COMMAND',
+ payload: {
+ contentElementId: 1,
+ command
+ }
+ }, '*');
+ await tick();
+
+ expect(callback).toHaveBeenCalledWith(command);
+ });
+});
diff --git a/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementEditorState-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementEditorState-spec.js
new file mode 100644
index 0000000000..c00ed50241
--- /dev/null
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useContentElementEditorState-spec.js
@@ -0,0 +1,133 @@
+import React, {useEffect} from 'react';
+import {act, fireEvent} from '@testing-library/react';
+
+import {frontend, useContentElementEditorState} from 'pageflow-scrolled/frontend';
+import {useEditorSelection} from 'frontend/inlineEditing/EditorState';
+import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects/inlineEditing';
+
+import '@testing-library/jest-dom/extend-expect';
+
+describe('inline editing useContentElementEditorState', () => {
+ useInlineEditingPageObjects();
+
+ it('lets content elements determine whether they are selected', () => {
+ frontend.contentElementTypes.register('test', {
+ component: function Test({configuration}) {
+ const {isSelected} = useContentElementEditorState();
+
+ return (
+
+ {isSelected ? 'Selected' : 'Unselected'}
+
+ );
+ }
+ });
+
+ const {getByTestId} = renderEntry({
+ seed: {
+ contentElements: [
+ {id: 1, typeName: 'test', configuration: {testId: 'one'}},
+ {id: 2, typeName: 'test', configuration: {testId: 'two'}}
+ ]
+ }
+ });
+ fireEvent.click(getByTestId('two'));
+
+ expect(getByTestId('one')).toHaveTextContent('Unselected');
+ expect(getByTestId('two')).toHaveTextContent('Selected');
+ });
+
+ it('exposes type matching the active selection', () => {
+ let captured = {};
+ let setSelectionRef;
+
+ function Test() {
+ const state = useContentElementEditorState();
+ const {select} = useEditorSelection();
+
+ captured = state;
+ useEffect(() => {
+ setSelectionRef = select;
+ }, [select]);
+
+ return null;
+ }
+
+ renderEntry({
+ contentElement: {ui: }
+ });
+
+ expect(captured.type).toBeNull();
+
+ act(() => setSelectionRef({type: 'contentElement', id: 1}));
+ expect(captured.type).toBe('contentElement');
+ expect(captured.isSelected).toBe(true);
+
+ act(() => setSelectionRef({type: 'contentElementComments', id: 1}));
+ expect(captured.type).toBe('contentElementComments');
+ expect(captured.isSelected).toBe(true);
+
+ act(() => setSelectionRef({type: 'newThread', id: 10}));
+ expect(captured.type).toBe('newThread');
+ expect(captured.isSelected).toBe(true);
+ });
+
+ it('returns true for isEditable', () => {
+ function Test() {
+ const {isEditable} = useContentElementEditorState();
+
+ return (
+
+ {isEditable ? 'Edit me' : 'Read only'}
+
+ );
+ }
+
+ const {getByTestId} = renderEntry({
+ contentElement: {ui: }
+ });
+
+ expect(getByTestId('contentElement')).toHaveTextContent('Edit me');
+ });
+
+ it('lets content elements publish transient state via post message', () => {
+
+ function Test() {
+ const {setTransientState} = useContentElementEditorState();
+
+ useEffect(() => setTransientState({some: 'state'}));
+ return null;
+ }
+
+ renderEntry({
+ contentElement: {ui: }
+ });
+
+ expect(window.parent.postMessage).toHaveBeenCalledWith({
+ type: 'UPDATE_TRANSIENT_CONTENT_ELEMENT_STATE',
+ payload: {
+ id: 1,
+ state: {some: 'state'}
+ }
+ }, expect.anything());
+ });
+
+ it('does not send message if transient state is shallow equal to previous transient state', () => {
+
+ function Test() {
+ const {setTransientState} = useContentElementEditorState();
+
+ useEffect(() => setTransientState({some: 'state'}));
+ return null;
+ }
+
+ const {rerender} = renderEntry({
+ contentElement: {ui: }
+ });
+
+ window.parent.postMessage.mockClear();
+ rerender();
+
+ expect(window.parent.postMessage).not.toHaveBeenCalled();
+ });
+});
diff --git a/entry_types/scrolled/package/spec/frontend/features/useWidgetConfigurationUpdate-spec.js b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useWidgetConfigurationUpdate-spec.js
similarity index 96%
rename from entry_types/scrolled/package/spec/frontend/features/useWidgetConfigurationUpdate-spec.js
rename to entry_types/scrolled/package/spec/frontend/inlineEditing/features/useWidgetConfigurationUpdate-spec.js
index 90462063cc..51c2e62c12 100644
--- a/entry_types/scrolled/package/spec/frontend/features/useWidgetConfigurationUpdate-spec.js
+++ b/entry_types/scrolled/package/spec/frontend/inlineEditing/features/useWidgetConfigurationUpdate-spec.js
@@ -2,10 +2,10 @@ import React, {useEffect} from 'react';
import {frontend, useWidgetConfigurationUpdate} from 'frontend';
-import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects';
+import {renderEntry, useInlineEditingPageObjects} from 'support/pageObjects/inlineEditing';
import '@testing-library/jest-dom/extend-expect'
-describe('useWidgetConfigurationUpdate', () => {
+describe('inline editing useWidgetConfigurationUpdate', () => {
useInlineEditingPageObjects();
diff --git a/entry_types/scrolled/package/spec/frontend/useContentElementCommandSubscription/inEditorPreview-spec.js b/entry_types/scrolled/package/spec/frontend/useContentElementCommandSubscription/inEditorPreview-spec.js
deleted file mode 100644
index 7835622914..0000000000
--- a/entry_types/scrolled/package/spec/frontend/useContentElementCommandSubscription/inEditorPreview-spec.js
+++ /dev/null
@@ -1,39 +0,0 @@
-import {frontend, Entry, useContentElementEditorCommandSubscription} from 'pageflow-scrolled/frontend';
-import {renderInEntry, fakeParentWindow, tick} from 'support';
-
-import React from 'react';
-import '@testing-library/jest-dom/extend-expect'
-
-import {loadInlineEditingExtensions} from 'frontend/inlineEditing';
-
-describe('useContentElementEditorCommandSubscription in editor preview', () => {
- beforeAll(loadInlineEditingExtensions);
-
- it('invokes callback for content element commands sent via post message', async () => {
- fakeParentWindow();
- const callback = jest.fn();
- frontend.contentElementTypes.register('test', {
- component: function Test({configuration}) {
- useContentElementEditorCommandSubscription(callback);
- return null;
- }
- });
-
- renderInEntry(, {
- seed: {
- contentElements: [{id: 5, typeName: 'test'}]
- }
- });
- const command = {type: 'SOME_COMMAND'};
- window.postMessage({
- type: 'CONTENT_ELEMENT_EDITOR_COMMAND',
- payload: {
- contentElementId: 5,
- command
- }
- }, '*');
- await tick();
-
- expect(callback).toHaveBeenCalledWith(command);
- });
-});
diff --git a/entry_types/scrolled/package/spec/frontend/useContentElementCommandSubscription/inFrontend-spec.js b/entry_types/scrolled/package/spec/frontend/useContentElementCommandSubscription/inFrontend-spec.js
deleted file mode 100644
index 154cb69b9d..0000000000
--- a/entry_types/scrolled/package/spec/frontend/useContentElementCommandSubscription/inFrontend-spec.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import {frontend, Entry, useContentElementEditorCommandSubscription} from 'pageflow-scrolled/frontend';
-import {renderInEntry} from 'support';
-
-import React from 'react';
-import '@testing-library/jest-dom/extend-expect'
-
-describe('useContentElementEditorCommandSubscription in frontend', () => {
- it('is noop', async () => {
- frontend.contentElementTypes.register('test', {
- component: function Test({configuration}) {
- useContentElementEditorCommandSubscription(() => {});
- return null;
- }
- });
-
- expect(() =>
- renderInEntry(, {
- seed: {
- contentElements: [{id: 5, typeName: 'test'}]
- }
- })
- ).not.toThrow();
- });
-});
diff --git a/entry_types/scrolled/package/spec/frontend/useContentElementEditorState/inEditorPreview-spec.js b/entry_types/scrolled/package/spec/frontend/useContentElementEditorState/inEditorPreview-spec.js
deleted file mode 100644
index 0650c64012..0000000000
--- a/entry_types/scrolled/package/spec/frontend/useContentElementEditorState/inEditorPreview-spec.js
+++ /dev/null
@@ -1,152 +0,0 @@
-import {frontend, Entry, useContentElementEditorState} from 'pageflow-scrolled/frontend';
-import {renderInEntry} from 'support';
-import {useFakeParentWindow} from 'support/fakeWindows';
-import {useEditorSelection} from 'frontend/inlineEditing/EditorState';
-
-import React, {useEffect} from 'react';
-import {act, fireEvent} from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect'
-
-import {loadInlineEditingExtensions} from 'frontend/inlineEditing';
-
-describe('useContentElementEditorState in editor preview', () => {
- beforeAll(loadInlineEditingExtensions);
- useFakeParentWindow();
-
- it('lets content elements determine whether they are selected', () => {
- frontend.contentElementTypes.register('test', {
- component: function Test({configuration}) {
- const {isSelected} = useContentElementEditorState();
-
- return (
-
- {isSelected ? 'Selected' : 'Unselected'}
-
- );
- }
- });
-
- const {getByTestId} = renderInEntry(, {
- seed: {
- contentElements: [
- {id: 1, typeName: 'test', configuration: {testId: 'one'}},
- {id: 2, typeName: 'test', configuration: {testId: 'two'}}
- ]
- }
- });
- fireEvent.click(getByTestId('two'));
-
- expect(getByTestId('one')).toHaveTextContent('Unselected');
- expect(getByTestId('two')).toHaveTextContent('Selected');
- });
-
- it('exposes type matching the active selection', () => {
- let captured = {};
- let setSelectionRef;
-
- frontend.contentElementTypes.register('test', {
- component: function Test() {
- const state = useContentElementEditorState();
- const {select} = useEditorSelection();
-
- captured = state;
- useEffect(() => {
- setSelectionRef = select;
- }, [select]);
-
- return null;
- }
- });
-
- renderInEntry(, {
- seed: {contentElements: [{id: 7, permaId: 70, typeName: 'test'}]}
- });
-
- expect(captured.type).toBeNull();
-
- act(() => setSelectionRef({type: 'contentElement', id: 7}));
- expect(captured.type).toBe('contentElement');
- expect(captured.isSelected).toBe(true);
-
- act(() => setSelectionRef({type: 'contentElementComments', id: 7}));
- expect(captured.type).toBe('contentElementComments');
- expect(captured.isSelected).toBe(true);
-
- act(() => setSelectionRef({type: 'newThread', id: 70}));
- expect(captured.type).toBe('newThread');
- expect(captured.isSelected).toBe(true);
- });
-
- it('returns true for isEditable', () => {
- frontend.contentElementTypes.register('test', {
- component: function Test({configuration}) {
- const {isEditable} = useContentElementEditorState();
-
- return (
-
- {isEditable ? 'Edit me' : 'Read only'}
-
- );
- }
- });
-
- const {getByTestId} = renderInEntry(, {
- seed: {
- contentElements: [{typeName: 'test'}]
- }
- });
-
- expect(getByTestId('contentElement')).toHaveTextContent('Edit me');
- });
-
- it('lets content elements publish transient state via post message', () => {
- frontend.contentElementTypes.register('test', {
- component: function Test() {
- const {setTransientState} = useContentElementEditorState();
-
- useEffect(() => setTransientState({some: 'state'}));
- return null;
- }
- });
-
- renderInEntry(, {
- seed: {
- contentElements: [
- {id: 5, typeName: 'test'}
- ]
- }
- });
-
- expect(window.parent.postMessage).toHaveBeenCalledWith({
- type: 'UPDATE_TRANSIENT_CONTENT_ELEMENT_STATE',
- payload: {
- id: 5,
- state: {some: 'state'}
- }
- }, expect.anything());
- });
-
- it('does not send message if transient state is shallow equal to previous transient state', () => {
- frontend.contentElementTypes.register('test', {
- component: function Test() {
- const {setTransientState} = useContentElementEditorState();
-
- useEffect(() => setTransientState({some: 'state'}));
- return null;
- }
- });
-
- const {rerender} = renderInEntry(, {
- seed: {
- contentElements: [
- {id: 5, typeName: 'test'}
- ]
- }
- });
-
- window.parent.postMessage.mockClear();
- rerender();
-
- expect(window.parent.postMessage).not.toHaveBeenCalled();
- });
-});
diff --git a/entry_types/scrolled/package/spec/frontend/useContentElementEditorState/inFrontend-spec.js b/entry_types/scrolled/package/spec/frontend/useContentElementEditorState/inFrontend-spec.js
deleted file mode 100644
index 866a876425..0000000000
--- a/entry_types/scrolled/package/spec/frontend/useContentElementEditorState/inFrontend-spec.js
+++ /dev/null
@@ -1,74 +0,0 @@
-import {frontend, Entry, useContentElementEditorState} from 'pageflow-scrolled/frontend';
-import {renderInEntry} from 'support';
-
-import React, {useEffect} from 'react';
-import {fireEvent} from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect'
-
-describe('useContentElementEditorState in frontend', () => {
- it('returns false for isSelected', () => {
- frontend.contentElementTypes.register('test', {
- component: function Test({configuration}) {
- const {isSelected} = useContentElementEditorState();
-
- return (
-
- {isSelected ? 'Selected' : 'Unselected'}
-
- );
- }
- });
-
- const {getByTestId} = renderInEntry(, {
- seed: {
- contentElements: [{typeName: 'test'}]
- }
- });
- fireEvent.click(getByTestId('contentElement'));
-
- expect(getByTestId('contentElement')).toHaveTextContent('Unselected');
- });
-
- it('returns false for isEditable', () => {
- frontend.contentElementTypes.register('test', {
- component: function Test({configuration}) {
- const {isEditable} = useContentElementEditorState();
-
- return (
-
- {isEditable ? 'Edit me' : 'Read only'}
-
- );
- }
- });
-
- const {getByTestId} = renderInEntry(, {
- seed: {
- contentElements: [{typeName: 'test'}]
- }
- });
-
- expect(getByTestId('contentElement')).toHaveTextContent('Read only');
- });
-
- it('provides noop setTransientState function', () => {
- frontend.contentElementTypes.register('test', {
- component: function Test({configuration}) {
- const {setTransientState} = useContentElementEditorState();
-
- useEffect(() => setTransientState({some: 'state'}));
- return null;
- }
- });
-
- expect(() =>
- renderInEntry(, {
- seed: {
- contentElements: [
- {typeName: 'test'}
- ]
- }
- })
- ).not.toThrow();
- });
-});
diff --git a/entry_types/scrolled/package/spec/support/pageObjects/index.js b/entry_types/scrolled/package/spec/support/pageObjects/index.js
index bb353f7187..708e7c394b 100644
--- a/entry_types/scrolled/package/spec/support/pageObjects/index.js
+++ b/entry_types/scrolled/package/spec/support/pageObjects/index.js
@@ -91,8 +91,6 @@ export function renderContentElement({typeName, configuration = {}, ...seedOptio
};
}
-export {useInlineEditingPageObjects} from './inlineEditing';
-
export function usePageObjects() {
beforeEach(() => {
jest.restoreAllMocks();