@wordpress/edit-post 8.48.0 → 8.48.1

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.
@@ -1,221 +0,0 @@
1
- /**
2
- * External dependencies
3
- */
4
- import { initializeEditor, getEditorHtml, fireEvent } from 'test/helpers';
5
-
6
- /**
7
- * WordPress dependencies
8
- */
9
- import { Platform } from '@wordpress/element';
10
- import { getBlockTypes, unregisterBlockType } from '@wordpress/blocks';
11
- import { registerCoreBlocks } from '@wordpress/block-library';
12
-
13
- beforeAll( () => {
14
- // Register all core blocks
15
- registerCoreBlocks();
16
- } );
17
-
18
- afterAll( () => {
19
- // Clean up registered blocks
20
- getBlockTypes().forEach( ( block ) => {
21
- unregisterBlockType( block.name );
22
- } );
23
- } );
24
-
25
- const MEDIA_OPTIONS = [
26
- 'Choose from device',
27
- 'Take a Photo',
28
- 'WordPress Media Library',
29
- ];
30
-
31
- const initialHtml = `
32
- <!-- wp:paragraph -->
33
- <p>First example paragraph.</p>
34
- <!-- /wp:paragraph -->
35
-
36
- <!-- wp:paragraph -->
37
- <p>Second example paragraph.</p>
38
- <!-- /wp:paragraph -->
39
- `;
40
-
41
- describe( 'when title is focused', () => {
42
- it( 'new blocks are inserted after the title', async () => {
43
- const screen = await initializeEditor( {
44
- initialHtml,
45
- } );
46
-
47
- // Focus first block
48
- fireEvent.press(
49
- screen.getAllByLabelText( /Paragraph Block. Row 1/ )[ 0 ]
50
- );
51
-
52
- // Focus title
53
- fireEvent(
54
- screen.getAllByLabelText( 'Post title. test' )[ 0 ],
55
- 'select'
56
- );
57
-
58
- // Add new Heading block
59
- fireEvent.press( screen.getByLabelText( 'Add block' ) );
60
- fireEvent.press( screen.getByText( 'Heading' ) );
61
-
62
- expect(
63
- screen.getAllByLabelText( /Heading Block. Row 1/ )[ 0 ]
64
- ).toBeDefined();
65
- expect(
66
- screen.getAllByLabelText( /Paragraph Block. Row 2/ )[ 0 ]
67
- ).toBeDefined();
68
-
69
- expect(
70
- screen.getAllByLabelText( /Paragraph Block. Row 3/ )[ 0 ]
71
- ).toBeDefined();
72
- } );
73
-
74
- it( 'media blocks should be displayed', async () => {
75
- const screen = await initializeEditor( {
76
- initialHtml,
77
- } );
78
-
79
- // Focus first block
80
- fireEvent.press(
81
- screen.getAllByLabelText( /Paragraph Block. Row 1/ )[ 0 ]
82
- );
83
-
84
- // Focus title
85
- fireEvent(
86
- screen.getAllByLabelText( 'Post title. test' )[ 0 ],
87
- 'select'
88
- );
89
-
90
- // Assert that the media buttons are visible
91
- const imageButton = await screen.findByTestId( 'insert-image-button' );
92
- expect( imageButton ).toBeVisible();
93
-
94
- const videoButton = await screen.findByTestId( 'insert-video-button' );
95
- expect( videoButton ).toBeVisible();
96
-
97
- const galleryButton = await screen.findByTestId(
98
- 'insert-gallery-button'
99
- );
100
- expect( galleryButton ).toBeVisible();
101
-
102
- const audioButton = await screen.findByTestId( 'insert-audio-button' );
103
- expect( audioButton ).toBeVisible();
104
- } );
105
- } );
106
-
107
- describe( 'when title is no longer focused', () => {
108
- it( 'new blocks are inserted after the currently focused block', async () => {
109
- const screen = await initializeEditor( {
110
- initialHtml,
111
- } );
112
-
113
- // Focus first block
114
- fireEvent.press(
115
- screen.getAllByLabelText( /Paragraph Block. Row 1/ )[ 0 ]
116
- );
117
-
118
- // Focus title
119
- fireEvent(
120
- screen.getAllByLabelText( 'Post title. test' )[ 0 ],
121
- 'select'
122
- );
123
-
124
- // Focus last block
125
- fireEvent.press(
126
- screen.getAllByLabelText( /Paragraph Block. Row 2/ )[ 0 ]
127
- );
128
-
129
- // Add new Heading block
130
- fireEvent.press( screen.getByLabelText( 'Add block' ) );
131
- fireEvent.press( screen.getByText( 'Heading' ) );
132
-
133
- expect(
134
- screen.getAllByLabelText( /Paragraph Block. Row 1/ )[ 0 ]
135
- ).toBeDefined();
136
- expect(
137
- screen.getAllByLabelText( /Paragraph Block. Row 2/ )[ 0 ]
138
- ).toBeDefined();
139
- expect(
140
- screen.getAllByLabelText( /Heading Block. Row 3/ )[ 0 ]
141
- ).toBeDefined();
142
- } );
143
-
144
- it( 'media blocks should not be displayed', async () => {
145
- const screen = await initializeEditor( {
146
- initialHtml,
147
- } );
148
-
149
- // Focus first block
150
- fireEvent.press(
151
- screen.getAllByLabelText( /Paragraph Block. Row 1/ )[ 0 ]
152
- );
153
-
154
- // Focus title
155
- fireEvent(
156
- screen.getAllByLabelText( 'Post title. test' )[ 0 ],
157
- 'select'
158
- );
159
-
160
- // Focus last block
161
- fireEvent.press(
162
- screen.getAllByLabelText( /Paragraph Block. Row 2/ )[ 0 ]
163
- );
164
-
165
- // Assert that the media buttons are not visible
166
- const imageButton = screen.queryByTestId( 'insert-image-button' );
167
- expect( imageButton ).toBeNull();
168
-
169
- const videoButton = screen.queryByTestId( 'insert-video-button' );
170
- expect( videoButton ).toBeNull();
171
-
172
- const galleryButton = screen.queryByTestId( 'insert-gallery-button' );
173
- expect( galleryButton ).toBeNull();
174
-
175
- const audioButton = screen.queryByTestId( 'insert-audio-button' );
176
- expect( audioButton ).toBeNull();
177
- } );
178
- } );
179
-
180
- describe( 'when nothing is selected', () => {
181
- it( 'media buttons and picker display correctly', async () => {
182
- const screen = await initializeEditor( {
183
- initialHtml,
184
- } );
185
-
186
- const { getByText, getByTestId } = screen;
187
-
188
- // Check that the gallery button is visible within the toolbar
189
- const galleryButton = await screen.queryByTestId(
190
- 'insert-gallery-button'
191
- );
192
- expect( galleryButton ).toBeVisible();
193
-
194
- // Press the toolbar Gallery button
195
- fireEvent.press( galleryButton );
196
-
197
- // Expect the block to be created
198
- expect(
199
- screen.getAllByLabelText( /Gallery Block. Row 3/ )[ 0 ]
200
- ).toBeDefined();
201
-
202
- expect( getByText( 'Choose images' ) ).toBeVisible();
203
- MEDIA_OPTIONS.forEach( ( option ) =>
204
- expect( getByText( option ) ).toBeVisible()
205
- );
206
-
207
- // Dismiss the picker
208
- if ( Platform.isIOS ) {
209
- fireEvent.press( getByText( 'Cancel' ) );
210
- } else {
211
- fireEvent( getByTestId( 'media-options-picker' ), 'backdropPress' );
212
- }
213
-
214
- // Expect the Gallery block to remain
215
- expect(
216
- screen.getAllByLabelText( /Gallery Block. Row 3/ )[ 0 ]
217
- ).toBeDefined();
218
-
219
- expect( getEditorHtml() ).toMatchSnapshot();
220
- } );
221
- } );
@@ -1,171 +0,0 @@
1
- /**
2
- * External dependencies
3
- */
4
- import memize from 'memize';
5
- import { I18nManager } from 'react-native';
6
- import { GestureHandlerRootView } from 'react-native-gesture-handler';
7
-
8
- /**
9
- * WordPress dependencies
10
- */
11
- import { Component } from '@wordpress/element';
12
- import {
13
- EditorProvider,
14
- ErrorBoundary,
15
- store as editorStore,
16
- } from '@wordpress/editor';
17
- import { parse, serialize } from '@wordpress/blocks';
18
- import { withDispatch, withSelect } from '@wordpress/data';
19
- import { compose } from '@wordpress/compose';
20
- import {
21
- subscribeSetFocusOnTitle,
22
- subscribeFeaturedImageIdNativeUpdated,
23
- } from '@wordpress/react-native-bridge';
24
- import { SlotFillProvider } from '@wordpress/components';
25
- import { store as coreStore } from '@wordpress/core-data';
26
-
27
- /**
28
- * Internal dependencies
29
- */
30
- import Layout from './components/layout';
31
-
32
- class Editor extends Component {
33
- constructor( props ) {
34
- super( ...arguments );
35
-
36
- if ( props.initialHtmlModeEnabled && props.mode === 'visual' ) {
37
- // Enable html mode if the initial mode the parent wants it but we're not already in it.
38
- this.props.switchEditorMode( 'text' );
39
- }
40
-
41
- this.getEditorSettings = memize( this.getEditorSettings, {
42
- maxSize: 1,
43
- } );
44
-
45
- this.setTitleRef = this.setTitleRef.bind( this );
46
- }
47
-
48
- getEditorSettings( settings ) {
49
- settings = {
50
- ...settings,
51
- isRTL: I18nManager.isRTL,
52
- };
53
-
54
- return settings;
55
- }
56
-
57
- componentDidMount() {
58
- const { editEntityRecord, postType, postId } = this.props;
59
-
60
- this.subscriptionParentSetFocusOnTitle = subscribeSetFocusOnTitle(
61
- () => {
62
- if ( this.postTitleRef ) {
63
- this.postTitleRef.focus();
64
- } else {
65
- // If the post title ref is not available, we postpone setting focus to when it's available.
66
- this.focusTitleWhenAvailable = true;
67
- }
68
- }
69
- );
70
-
71
- this.subscriptionParentFeaturedImageIdNativeUpdated =
72
- subscribeFeaturedImageIdNativeUpdated( ( payload ) => {
73
- editEntityRecord(
74
- 'postType',
75
- postType,
76
- postId,
77
- { featured_media: payload.featuredImageId },
78
- {
79
- undoIgnore: true,
80
- }
81
- );
82
- } );
83
- }
84
-
85
- componentWillUnmount() {
86
- if ( this.subscriptionParentSetFocusOnTitle ) {
87
- this.subscriptionParentSetFocusOnTitle.remove();
88
- }
89
-
90
- if ( this.subscribeFeaturedImageIdNativeUpdated ) {
91
- this.subscribeFeaturedImageIdNativeUpdated.remove();
92
- }
93
- }
94
-
95
- setTitleRef( titleRef ) {
96
- if ( this.focusTitleWhenAvailable && ! this.postTitleRef ) {
97
- this.focusTitleWhenAvailable = false;
98
- titleRef.focus();
99
- }
100
-
101
- this.postTitleRef = titleRef;
102
- }
103
-
104
- render() {
105
- const {
106
- settings,
107
- initialEdits,
108
- post,
109
- postId,
110
- postType,
111
- featuredImageId,
112
- initialHtml,
113
- ...props
114
- } = this.props;
115
-
116
- const editorSettings = this.getEditorSettings( settings );
117
-
118
- const normalizedPost = post || {
119
- id: postId,
120
- title: {
121
- raw: props.initialTitle || '',
122
- },
123
- featured_media: featuredImageId,
124
- content: {
125
- // Make sure the post content is in sync with gutenberg store
126
- // to avoid marking the post as modified when simply loaded
127
- // For now, let's assume: serialize( parse( html ) ) !== html.
128
- raw: serialize( parse( initialHtml || '' ) ),
129
- },
130
- type: postType,
131
- status: 'draft',
132
- meta: [],
133
- };
134
-
135
- return (
136
- <GestureHandlerRootView style={ { flex: 1 } }>
137
- <SlotFillProvider>
138
- <EditorProvider
139
- settings={ editorSettings }
140
- post={ normalizedPost }
141
- initialEdits={ initialEdits }
142
- useSubRegistry={ false }
143
- { ...props }
144
- >
145
- <ErrorBoundary>
146
- <Layout setTitleRef={ this.setTitleRef } />
147
- </ErrorBoundary>
148
- </EditorProvider>
149
- </SlotFillProvider>
150
- </GestureHandlerRootView>
151
- );
152
- }
153
- }
154
-
155
- export default compose( [
156
- withSelect( ( select ) => {
157
- const { getEditorMode } = select( editorStore );
158
-
159
- return {
160
- mode: getEditorMode(),
161
- };
162
- } ),
163
- withDispatch( ( dispatch ) => {
164
- const { switchEditorMode } = dispatch( editorStore );
165
- const { editEntityRecord } = dispatch( coreStore );
166
- return {
167
- switchEditorMode,
168
- editEntityRecord,
169
- };
170
- } ),
171
- ] )( Editor );
@@ -1,41 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import '@wordpress/core-data';
5
- import '@wordpress/format-library';
6
- import { dispatch } from '@wordpress/data';
7
- import { store as preferencesStore } from '@wordpress/preferences';
8
-
9
- /**
10
- * Internal dependencies
11
- */
12
- export { store } from './store';
13
- import Editor from './editor';
14
-
15
- /**
16
- * Initializes the Editor and returns a componentProvider
17
- * that can be registered with `AppRegistry.registerComponent`
18
- *
19
- * @param {string} id Unique identifier for editor instance.
20
- * @param {Object} postType Post type of the post to edit.
21
- * @param {Object} postId ID of the post to edit (unused right now)
22
- */
23
- export function initializeEditor( id, postType, postId ) {
24
- dispatch( preferencesStore ).setDefaults( 'core/edit-post', {
25
- editorMode: 'visual',
26
- fullscreenMode: true,
27
- inactivePanels: [],
28
- openPanels: [ 'post-status' ],
29
- welcomeGuide: true,
30
- } );
31
- dispatch( preferencesStore ).setDefaults( 'core', {
32
- editorTool: 'edit',
33
- hiddenBlockTypes: [],
34
- inactivePanels: [],
35
- openPanels: [ 'post-status' ],
36
- isPublishSidebarEnabled: true,
37
- fixedToolbar: false,
38
- } );
39
-
40
- return <Editor postId={ postId } postType={ postType } />;
41
- }
@@ -1,105 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`Editor adds empty image block when pasting unsupported HTML local image path 1`] = `
4
- "<!-- wp:image -->
5
- <figure class="wp-block-image"><img src="" alt=""/></figure>
6
- <!-- /wp:image -->"
7
- `;
8
-
9
- exports[`Editor adds image block when pasting HTML local image path 1`] = `
10
- "<!-- wp:image -->
11
- <figure class="wp-block-image"><img src="file:///path/to/file.png" alt=""/></figure>
12
- <!-- /wp:image -->"
13
- `;
14
-
15
- exports[`Editor appends media correctly for allowed types 1`] = `
16
- "<!-- wp:image -->
17
- <figure class="wp-block-image"><img src="https://test-site.files.wordpress.com/local-image-1.jpeg" alt=""/></figure>
18
- <!-- /wp:image -->
19
-
20
- <!-- wp:image -->
21
- <figure class="wp-block-image"><img src="https://test-site.files.wordpress.com/local-image-3.jpeg" alt=""/></figure>
22
- <!-- /wp:image -->"
23
- `;
24
-
25
- exports[`Editor appends media correctly for allowed types and skips unsupported ones 1`] = `
26
- "<!-- wp:image -->
27
- <figure class="wp-block-image"><img src="https://test-site.files.wordpress.com/local-image-1.jpeg" alt=""/></figure>
28
- <!-- /wp:image -->
29
-
30
- <!-- wp:video -->
31
- <figure class="wp-block-video"><video controls src="file:///local-video-4.mp4"></video></figure>
32
- <!-- /wp:video -->"
33
- `;
34
-
35
- exports[`Editor on content update parses markdown into blocks 1`] = `
36
- "<!-- wp:paragraph -->
37
- <p>Lorem ipsum dolor sit amet, consectetur adipiscing<br />elit.</p>
38
- <!-- /wp:paragraph -->
39
-
40
- <!-- wp:heading -->
41
- <h2 class="wp-block-heading">Overview</h2>
42
- <!-- /wp:heading -->
43
-
44
- <!-- wp:list -->
45
- <ul class="wp-block-list"><!-- wp:list-item -->
46
- <li>Lorem ipsum dolor sit amet</li>
47
- <!-- /wp:list-item -->
48
-
49
- <!-- wp:list-item -->
50
- <li>Consectetur adipiscing<br>elit</li>
51
- <!-- /wp:list-item -->
52
-
53
- <!-- wp:list-item -->
54
- <li>Integer nec odio</li>
55
- <!-- /wp:list-item --></ul>
56
- <!-- /wp:list -->
57
-
58
- <!-- wp:heading -->
59
- <h2 class="wp-block-heading">Details</h2>
60
- <!-- /wp:heading -->
61
-
62
- <!-- wp:list {"ordered":true} -->
63
- <ol class="wp-block-list"><!-- wp:list-item -->
64
- <li>Sed cursus ante dapibus diam</li>
65
- <!-- /wp:list-item -->
66
-
67
- <!-- wp:list-item -->
68
- <li>Nulla quis sem at nibh elementum imperdiet</li>
69
- <!-- /wp:list-item -->
70
-
71
- <!-- wp:list-item -->
72
- <li>Duis sagittis ipsum <code>## Mixed Lists</code></li>
73
- <!-- /wp:list-item --></ol>
74
- <!-- /wp:list -->
75
-
76
- <!-- wp:list -->
77
- <ul class="wp-block-list"><!-- wp:list-item -->
78
- <li>Key Points:</li>
79
- <!-- /wp:list-item --></ul>
80
- <!-- /wp:list -->
81
-
82
- <!-- wp:list {"ordered":true} -->
83
- <ol class="wp-block-list"><!-- wp:list-item -->
84
- <li>Lorem ipsum dolor sit amet</li>
85
- <!-- /wp:list-item -->
86
-
87
- <!-- wp:list-item -->
88
- <li><br>Consectetur adipiscing elit</li>
89
- <!-- /wp:list-item -->
90
-
91
- <!-- wp:list-item -->
92
- <li>Integer nec odio</li>
93
- <!-- /wp:list-item --></ol>
94
- <!-- /wp:list -->
95
-
96
- <!-- wp:list -->
97
- <ul class="wp-block-list"><!-- wp:list-item -->
98
- <li>Additional Info:<br>-<br>Sed cursus ante dapibus diam</li>
99
- <!-- /wp:list-item -->
100
-
101
- <!-- wp:list-item -->
102
- <li>Nulla quis sem at nibh elementum imperdiet</li>
103
- <!-- /wp:list-item --></ul>
104
- <!-- /wp:list -->"
105
- `;