Prevent editor crash when updating styles in Site Desing component (#… · godaddy-wordpress/coblocks@7aadfe6 · GitHub

godaddy-wordpress / coblocks Public

• Notifications You must be signed in to change notification settings
• Fork 143
• Star 794

• Code
• Issues 117
• Pull requests 22
• Actions
• Security and quality
• Insights

Additional navigation options

Commit 7aadfe6

Browse filesBrowse the repository at this point in the historyBrowse files

EvanHerman

authored

Prevent editor crash when updating styles in Site Desing component (#2631)

* Fix CoBlocks/Go Design Style conflict * Refactor to remove iframe injection * Update RC tests to 6.8-RC4

1 parent d54db44 commit 7aadfe6
Copy full SHA for 7aadfe6

5 files changed

+18-5Lines changed: 18 additions & 5 deletions

File tree

Expand file treeCollapse file tree

Open diff view settings

Filter options

• .github/workflows
  • test-wp-next.yml
• src/extensions/site-design
  • color-palette-preview.js
  • component.js
  • hooks
    • useFontSize.js
    • useTypeRatio.js

Expand file treeCollapse file tree

Open diff view settings

Collapse file

‎.github/workflows/test-wp-next.yml‎

Copy file name to clipboardExpand all lines: .github/workflows/test-wp-next.yml

+2-2Lines changed: 2 additions & 2 deletions

Original file line number	Diff line number	Diff line change
@@ -23,7 +23,7 @@ jobs:
23	23	runs-on: ubuntu-latest
24	24	outputs:
25	25	# Should be current latest WP Next release on `wordpress.org`. eg: `https://wordpress.org/wordpress-6.5-beta2.zip`
26		- wp_next: "https://wordpress.org/wordpress-6.5-RC4.zip"
	26	+ wp_next: "https://wordpress.org/wordpress-6.8-RC2.zip"
27	27	steps:
28	28	- run: echo "Setting WP Next Constant"
29	29
@@ -35,7 +35,7 @@ jobs:
35	35	uses: ./.github/workflows/test-e2e-cypress.yml
36	36	with:
37	37	wpVersion: ${{ needs.set_constant.outputs.wp_next }}
38		- installPath: "tests-wordpress-6.5-RC4"
	38	+ installPath: "tests-wordpress-6.8-RC2"
39	39	theme: "https://downloads.wordpress.org/theme/go.zip"
40	40	concurrency:
41	41	group: chrome-wp-next

Collapse file

‎src/extensions/site-design/color-palette-preview.js‎

Copy file name to clipboardExpand all lines: src/extensions/site-design/color-palette-preview.js

+4-1Lines changed: 4 additions & 1 deletion

Original file line number	Diff line number	Diff line change
@@ -45,7 +45,10 @@ export function ColorPalettePreviews() {
45	45	updateColors();
46	46
47	47	Object.entries( currentColors ).forEach( ( [ name, color ] ) => {
48		- document.getElementsByClassName( siteDesign.editorClass )[ 0 ].style.setProperty( `--go--color--${ name }`, color );
	48	+ const editor = document.getElementsByClassName( siteDesign.editorClass )[ 0 ];
	49	+ if ( editor ) {
	50	+ document.getElementsByClassName( siteDesign.editorClass )[ 0 ].style.setProperty( `--go--color--${ name }`, color );
	51	+ }
49	52	} );
50	53	}, [ currentColors ] );
51	54

Collapse file

‎src/extensions/site-design/component.js‎

Copy file name to clipboardExpand all lines: src/extensions/site-design/component.js

+4Lines changed: 4 additions & 0 deletions

Original file line number	Diff line number	Diff line change
@@ -63,6 +63,10 @@ export function SiteDesignStyles() {
63	63
64	64	const stylesElement = document.getElementById( 'site-design-styles' );
65	65
	66	+ if ( ! stylesElement ) {
	67	+ return;
	68	+ }
	69	+
66	70	fontStylesCache = !! fontStylesCache ? fontStylesCache : designResp.fontStyles;
67	71
68	72	// Set the style element innerHTML to remove the old design style.

Collapse file

‎src/extensions/site-design/hooks/useFontSize.js‎

Copy file name to clipboardExpand all lines: src/extensions/site-design/hooks/useFontSize.js

+4-1Lines changed: 4 additions & 1 deletion

Original file line number	Diff line number	Diff line change
@@ -16,7 +16,10 @@ function useFontSize() {
16	16	if ( ! baseFontSize ) {
17	17	return;
18	18	}
19		- document.getElementsByClassName( siteDesign.editorClass )[ 0 ].style.setProperty( '--go--font-size', `${ baseFontSize }rem` );
	19	+ const editor = document.getElementsByClassName( siteDesign.editorClass )[ 0 ];
	20	+ if ( editor ) {
	21	+ editor.style.setProperty( '--go--font-size', `${ baseFontSize }rem` );
	22	+ }
20	23	}, [ baseFontSize ] );
21	24
22	25	return [ baseFontSize, designFontSize ];

Collapse file

‎src/extensions/site-design/hooks/useTypeRatio.js‎

Copy file name to clipboardExpand all lines: src/extensions/site-design/hooks/useTypeRatio.js

+4-1Lines changed: 4 additions & 1 deletion

Original file line number	Diff line number	Diff line change
@@ -14,7 +14,10 @@ function useTypeRatio() {
14	14	if ( ! typeRatio ) {
15	15	return;
16	16	}
17		- document.getElementsByClassName( siteDesign.editorClass )[ 0 ].style.setProperty( '--go--type-ratio', typeRatio );
	17	+ const editor = document.getElementsByClassName( siteDesign.editorClass )[ 0 ];
	18	+ if ( editor ) {
	19	+ editor.style.setProperty( '--go--type-ratio', typeRatio );
	20	+ }
18	21	}, [ typeRatio ] );
19	22
20	23	return [ typeRatio, designTypeRatio ];

0 commit comments

Comments

0 (0)