AdvancedCustomFields / AdvancedCustomFields/acf

5.9.0-RC1 - Setting 'align_content' => 'matrix' throws React error in WP < 5.5

Open
#352 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
PHP
Stars
945
Forks
197
PR merge metrics
No merged PRs in 30d

Description

After upgrading to ACF Pro 5.9.0-RC1 I ran into JS errors on blocks having set ['align_content' => 'matrix'], probably sure because the site is running on WordPress 5.4.2 and lacks from the new matrix control.

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `r`.
    in r (created by t)
    in t (created by Edit)
    in Edit (created by WithToolbarControls(Edit))
    in WithToolbarControls(Edit) (created by WithInspectorControl(WithToolbarControls(Edit)))
    in WithInspectorControl(WithToolbarControls(Edit)) (created by WithInspectorControl(WithInspectorControl(WithToolbarControls(Edit))))
    in WithInspectorControl(WithInspectorControl(WithToolbarControls(Edit)))
    in Unknown (created by WithDispatch(Component))
    in WithDispatch(Component)
    in Unknown (created by WithMultipleValidation(WithInspectorControl(WithInspectorControl(WithToolbarControls(Edit)))))
    in WithMultipleValidation(WithInspectorControl(WithInspectorControl(WithToolbarControls(Edit)))) (created by WithFilters(Edit))
    in WithFilters(Edit) (created by BlockEdit)
    in BlockEdit (created by block_BlockListBlock)
    in div (created by block_BlockListBlock)
    in BlockCrashBoundary (created by block_BlockListBlock)
    in div (created by ForwardRef)
    in ForwardRef (created by block_BlockListBlock)
    in block_BlockListBlock
    in Unknown (created by WithSelect(block_BlockListBlock))
    in WithSelect(block_BlockListBlock) (created by (WithSelect(block_BlockListBlock)))
    in (WithSelect(block_BlockListBlock)) (created by WithDefaultAttributes((WithSelect(block_BlockListBlock))))
    in WithDefaultAttributes((WithSelect(block_BlockListBlock))) (created by WithFilters(block_BlockListBlock))
    in WithFilters(block_BlockListBlock) (created by IfCondition(WithFilters(block_BlockListBlock)))
    in IfCondition(WithFilters(block_BlockListBlock)) (created by WithDispatch(IfCondition(WithFilters(block_BlockListBlock))))
    in WithDispatch(IfCondition(WithFilters(block_BlockListBlock)))
    in Unknown (created by WithSelect(WithDispatch(IfCondition(WithFilters(block_BlockListBlock)))))
    in WithSelect(WithDispatch(IfCondition(WithFilters(block_BlockListBlock))))
    in Unknown (created by Pure(WithViewportMatch(WithSelect(WithDispatch(IfCondition(WithFilters(block_BlockListBlock)))))))
    in Pure(WithViewportMatch(WithSelect(WithDispatch(IfCondition(WithFilters(block_BlockListBlock)))))) (created by BlockList)
    in div (created by ForwardRef(RootContainer))
    in div (created by InsertionPoint)
    in InsertionPoint (created by ForwardRef(RootContainer))
    in ForwardRef(RootContainer) (created by BlockList)
    in BlockList
    in Unknown (created by VisualEditor)
    in div (created by CopyHandler)
    in CopyHandler (created by WithDispatch(CopyHandler))
    in WithDispatch(CopyHandler) (created by VisualEditor)
    in div (created by ObserveTyping)
    in ObserveTyping (created by WithSafeTimeout(ObserveTyping))
    in WithSafeTimeout(ObserveTyping) (created by VisualEditor)
    in div (created by WritingFlow)
    in div (created by WritingFlow)
    in WritingFlow (created by VisualEditor)
    in div (created by CopyHandler)
    in CopyHandler (created by WithDispatch(CopyHandler))
    in WithDispatch(CopyHandler) (created by VisualEditor)
    in div (created by Typewriter)
    in Typewriter
    in Unknown (created by WithSelect(Typewriter))
    in WithSelect(Typewriter) (created by VisualEditor)
    in div (created by BlockSelectionClearer)
    in BlockSelectionClearer (created by WithDispatch(BlockSelectionClearer))
    in WithDispatch(BlockSelectionClearer)
    in Unknown (created by WithSelect(WithDispatch(BlockSelectionClearer)))
    in WithSelect(WithDispatch(BlockSelectionClearer)) (created by VisualEditor)
    in VisualEditor (created by Layout)
    in div (created by EditorSkeleton)
    in div (created by EditorSkeleton)
    in div (created by EditorSkeleton)
    in EditorSkeleton (created by NavigateRegions(EditorSkeleton))
    in div (created by NavigateRegions(EditorSkeleton))
    in NavigateRegions(EditorSkeleton) (created by Layout)
    in div (created by FocusReturnProvider)
    in FocusReturnProvider (created by Layout)
    in Layout (created by Editor)
    in ErrorBoundary (created by Editor)
    in BlockEditorProvider (created by WithDispatch(BlockEditorProvider))
    in WithDispatch(BlockEditorProvider)
    in Unknown (created by Context.Consumer)
    in WithRegistryProvider(WithDispatch(BlockEditorProvider)) (created by EditorProvider)
    in EntityProvider (created by EditorProvider)
    in EntityProvider (created by EditorProvider)
    in EditorProvider (created by WithDispatch(EditorProvider))
    in WithDispatch(EditorProvider)
    in Unknown (created by WithSelect(WithDispatch(EditorProvider)))
    in WithSelect(WithDispatch(EditorProvider))
    in Unknown (created by Context.Consumer)
    in WithRegistryProvider(WithSelect(WithDispatch(EditorProvider))) (created by Editor)
    in div (created by DropZoneProvider)
    in DropZoneProvider (created by Editor)
    in slot_fill_provider_SlotFillProvider (created by SlotFillProvider)
    in SlotFillProvider (created by Editor)
    in StrictMode (created by Editor)
    in Editor (created by WithDispatch(Editor))
    in WithDispatch(Editor)
    in Unknown (created by WithSelect(WithDispatch(Editor)))
    in WithSelect(WithDispatch(Editor)) react.js:260:32

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the block editor error with ACF Pro 5.9.0-RC1 on WordPress 5.4.2 using a block whose align_content is set to matrix. Start by tracing the matrix control integration indicated by the React stack trace and compare it with WordPress 5.5 behavior; done means the block editor no longer throws the invalid React element error on older supported WordPress versions.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, php, react, wordpress
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.