search

neos / neos-ui

Neos CMS UI written in ReactJS with Immutable data structures.
GNU General Public License v3.0
264 stars 136 forks source link

White page after discard all #2916

Open gerdemann opened 3 years ago

gerdemann commented 3 years ago

Description

I get a white page when I click on "discard all" and then want to edit something inline again.

Steps to Reproduce

  1. Edit some properties
  2. Click on "discard all"
  3. Click in an inline editable field

Expected behavior

I can edit the property.

Actual behavior

I get a white page with the following error in console:

stacktrace 
index.js:43 Uncaught TypeError: Cannot read property 'contextPath' of null
    at InlineUI.render (index.js:43)
    at gi (react-dom.production.min.js:182)
    at fi (react-dom.production.min.js:181)
    at xo (react-dom.production.min.js:263)
    at Qj (react-dom.production.min.js:246)
    at Kj (react-dom.production.min.js:246)
    at yj (react-dom.production.min.js:239)
    at react-dom.production.min.js:123
    at w.unstable_runWithPriority (scheduler.production.min.js:18)
    at cg (react-dom.production.min.js:122)
render @ index.js:43
gi @ react-dom.production.min.js:182
fi @ react-dom.production.min.js:181
xo @ react-dom.production.min.js:263
Qj @ react-dom.production.min.js:246
Kj @ react-dom.production.min.js:246
yj @ react-dom.production.min.js:239
(anonymous) @ react-dom.production.min.js:123
w.unstable_runWithPriority @ scheduler.production.min.js:18
cg @ react-dom.production.min.js:122
fg @ react-dom.production.min.js:123
gg @ react-dom.production.min.js:122
Mj @ react-dom.production.min.js:240
notify @ Subscription.js:23
notifyNestedSubs @ Subscription.js:65
handleChangeWrapper @ Subscription.js:70
dispatch @ redux.js:221
(anonymous) @ clipboardMiddleware.js:22
(anonymous) @ localStorageMiddleware.js:21
(anonymous) @ middleware.js:66
focusSelectedNode @ initializeGuestFrame.js:110
(anonymous) @ initializeGuestFrame.js:125

Affected Versions

Neos: 5.3 UI: 5.3.8

dlubitz commented 3 years ago

Same here! I've noticed it multiple times but couldn't reproduce it. Thanks @gerdemann .

I could narrow it down a bit more. The error happens if you click an inline editable element AFTER /neos/preview?node=.... request has been started and BEFORE you get the response.

After getting the response page is fully reloaded and selecting elements works as expected.

Sebobo commented 3 years ago

@dlubitz @gerdemann I wasn't able to reproduce the issue but I fixed the line where your error happened in #2942. Can either of you check if it's resolved with my patch?

grebaldi commented 3 years ago

I tried the above steps, but couldn't reproduce the issue first. Then I turned on network throttling to be able to focus an inline editable element quickly before the response from /neos/preview?node=.... arrives.

Adn indeed, the UI crashed but with a myriad of other error messages (the one reported above was not among them):

Errors: 
Uncaught TypeError: _ckeditorerror2.default.rethrowUnexpectedError is not a function
    change view.js:486
    forceRender view.js:502
    _renderTimeoutId focusobserver.js:40
    setTimeout handler*FocusObserver/< focusobserver.js:40
    fire emittermixin.js:207
    fire domeventobserver.js:96
    onDomEvent focusobserver.js:63
    observe domeventobserver.js:79
    fire emittermixin.js:207
    domListener emittermixin.js:235
    attach emittermixin.js:193
    listenTo emittermixin.js:59
    observe domeventobserver.js:77
    observe domeventobserver.js:76
    attachDomRoot view.js:275
    init decouplededitorui.js:87
    create decouplededitor.js:238
    promise callback*create/< decouplededitor.js:237
    create decouplededitor.js:224
    createEditor ckEditorApi.js:60
    default initializePropertyDomNode.js:58
    default initializeContentDomNode.js:57
    initializeNodes initializeGuestFrame.js:148
    requestIdleCallback handler*initializeGuestFrame$/initializeNodes preview:17
    EventListener.handleEvent* preview:15
view.js:486:17
Key must be a string 
Inspector@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:357174:24
ConnectFunction@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:279187:75
NeosDecorator@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:326995:50
div
SideBar@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:374532:42
Themed@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:106477:24
RightSideBar@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:357656:24
ConnectFunction@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:279187:75
NeosDecorator@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:326995:50
div
App@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:347191:26
Neos@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:354240:24
./node_modules/react-dnd/dist/esm/common/DndProvider.js/ preview:17
    EventListener.handleEvent* preview:15
ckeditorerror.js:59:39
Uncaught CKEditorError: cannot-change-view-tree: Attempting to make changes to the view when it is in an incorrect state: rendering or post-fixers are in progress. This may cause some unexpected behavior and inconsistency between the DOM and the view. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-cannot-change-view-tree
    CKEditorError ckeditorerror.js:59
    change view.js:451
    removePlaceholder neosPlaceholder.js:47
    updatePlaceholder neosPlaceholder.js:56
    init neosPlaceholder.js:71
    fire emittermixin.js:207
    set observablemixin.js:92
    _focus focustracker.js:121
    add focustracker.js:81
    fire emittermixin.js:207
    domListener emittermixin.js:235
    attach emittermixin.js:193
    listenTo emittermixin.js:59
    add focustracker.js:81
    init decouplededitorui.js:74
    create decouplededitor.js:238
    promise callback*create/< decouplededitor.js:237
    create decouplededitor.js:224
    createEditor ckEditorApi.js:60
    default initializePropertyDomNode.js:58
    default initializeContentDomNode.js:57
    initializeNodes initializeGuestFrame.js:148
    requestIdleCallback handler*initializeGuestFrame$/initializeNodes preview:17
    EventListener.handleEvent* preview:15
ckeditorerror.js:59:39
Key must be a string 
Inspector@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:357174:24
ConnectFunction@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:279187:75
NeosDecorator@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:326995:50
div
SideBar@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:374532:42
Themed@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:106477:24
RightSideBar@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:357656:24
ConnectFunction@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:279187:75
NeosDecorator@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:326995:50
div
App@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:347191:26
Neos@https://neos-ui-pr-2942-review.ddev.site/_Resources/Static/Packages/Neos.Neos.Ui/JavaScript/Host.js?f32bdedc:354240:24
./node_modules/react-dnd/dist/esm/common/DndProvider.js/ preview:17
    EventListener.handleEvent* preview:15
index.js:136:15
The above error occurred in the  component:
    in Inspector (created by ConnectFunction)
    in ConnectFunction (created by Context.Consumer)
    in Neos(Connect(Inspector)) (created by RightSideBar)
    in div (created by SideBar)
    in SideBar (created by ThemedSideBar)
    in ThemedSideBar (created by RightSideBar)
    in RightSideBar (created by ConnectFunction)
    in ConnectFunction (created by Context.Consumer)
    in Neos(Connect(RightSideBar)) (created by App)
    in div (created by App)
    in App (created by Root)
    in Neos (created by Root)
    in Unknown (created by Root)
    in Provider (created by Root)
    in div (created by Root)
    in Root

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries. react_devtools_backend.js:2574:23
Uncaught TypeError: can't convert null to object
    preprocessViewConfiguration index.js:136
    preprocessViewConfigurationDebounced index.js:173
    Lodash 3
    componentDidUpdate index.js:123
    React 6
    unstable_runWithPriority scheduler.development.js:697
    React 5
    unstable_runWithPriority scheduler.development.js:697
    React 4
    Redux 4
    e content:1
    clipboardMiddleware clipboardMiddleware.js:22
    localStorageMiddleware localStorageMiddleware.js:21
    sagaMiddleware Redux
    focusSelectedNode initializeGuestFrame.js:110
    initializeGuestFrame$/< initializeGuestFrame.js:125
    initializeGuestFrame$ initializeGuestFrame.js:123
    tryCatch runtime.js:45
    invoke runtime.js:271
    method runtime.js:97
    Redux 10
    onFrameChange index.js:155
    UNSAFE_componentWillMount frame.tsx:118
     preview:17
    EventListener.handleEvent* preview:15
index.js:136:15
Uncaught CKEditorError: cannot-change-view-tree: Attempting to make changes to the view when it is in an incorrect state: rendering or post-fixers are in progress. This may cause some unexpected behavior and inconsistency between the DOM and the view. Read more: https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-cannot-change-view-tree
    CKEditorError ckeditorerror.js:59
    change view.js:451
    removePlaceholder neosPlaceholder.js:47
    updatePlaceholder neosPlaceholder.js:56
    init neosPlaceholder.js:71
    fire emittermixin.js:207
    set observablemixin.js:92
    _nextEventLoopTimeout focustracker.js:136
    setTimeout handler*_blur focustracker.js:134
    add focustracker.js:82
    fire emittermixin.js:207
    domListener emittermixin.js:235
    React 8
    unstable_runWithPriority scheduler.development.js:697
    React 5
    unstable_runWithPriority scheduler.development.js:697
    React 4
    Redux 4
    e content:1
    clipboardMiddleware clipboardMiddleware.js:22
    localStorageMiddleware localStorageMiddleware.js:21
    sagaMiddleware Redux
    focusSelectedNode initializeGuestFrame.js:110
    initializeGuestFrame$/< initializeGuestFrame.js:125
    initializeGuestFrame$ initializeGuestFrame.js:123
    tryCatch runtime.js:45
    invoke runtime.js:271
    method runtime.js:97
    Redux 10
    onFrameChange index.js:155
    UNSAFE_componentWillMount frame.tsx:118
     preview:17
    EventListener.handleEvent* preview:15
ckeditorerror.js:59:39

@Sebobo: I'm afraid your patch doesn't solve the issue :(

Sebobo commented 3 years ago

@grebaldi thx for checking. I had also tried with throttling (slow 3g) but it never happened.

markusguenther commented 2 years ago

Wanted to review that but did not manage to reproduce the issue :/ Is there a trick?

markusguenther commented 2 years ago

Ok tried that now with 3G throttling but got another issue.

Screenshot 2021-10-19 at 19 40 39 Screenshot 2021-10-19 at 20 28 14

So even with the patch I will get this error, but no white page.

markusguenther commented 2 years ago

I throttled to regular 3G and used the Firefox dev version on macOS 11.6.

markusguenther commented 2 years ago

Ok, think we have it, would be nice to get some reviews. Does not need to be a core team member :)

https://user-images.githubusercontent.com/1014126/137981249-320562d0-91a0-4aae-8e9d-b1b485fddc9e.mp4

markusguenther commented 2 years ago

The PR #2942 lead to a regression and has been reverted. So we need to reopen the issue :/