[MGNLFE-410] EditablePage children prop - react-editor Created: 03/Feb/23  Updated: 03/Feb/23

Status: Open
Project: Magnolia Frontend Helpers
Component/s: None
Affects Version/s: 1.3.0
Fix Version/s: None

Type: Bug Priority: Neutral
Reporter: Mykola Assignee: Unassigned
Resolution: Unresolved Votes: 1
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified
Environment:

@magnolia/react-editor@1.3.0


Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Bug DoR:
[ ]* Steps to reproduce, expected, and actual results filled
[ ]* Affected version filled

 Description   

Steps to reproduce

  1. Try to create component, that uses EditableArea (like Slider > Slide, or List > ListItem)
  2. Create environment, where you will use component in isolation (Storybook, Jest, etc)
  3. Try to provide story with composition of parent-child component
  4. In order to do that you need to provide EditablePage in decorators, because EditablePage creates context, that area will use (EditableArea.js@getParentTemplateId)
<EditablePage content={{}} config={config} templateAnnotations={null}>
  <Story />
</EditablePage>
  1. Try to run storybook/jest/etc

Expected results

Component renders without errors

Actual results

Component renders, but with type error in browser dev tools
mgnl-react-editor throws:

Warning: Failed prop type: Invalid prop `children` of type `object` supplied to `EditablePage`, expected a single ReactElement type. 

Workaround

Development notes

I suppose that EditablePage was designed to use as self-closed tag, and doesn't receive children without errors, because of the PropTypes.elementType validator


Generated at Mon Feb 12 05:47:09 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.