Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Backdrop] Doesn't appear before JS is loaded #19436

Closed
2 tasks done
btmorex opened this issue Jan 28, 2020 · 5 comments · Fixed by #20500
Closed
2 tasks done

[Backdrop] Doesn't appear before JS is loaded #19436

btmorex opened this issue Jan 28, 2020 · 5 comments · Fixed by #20500
Labels
component: backdrop This is the name of the generic UI component, not the React module! docs Improvements or additions to the documentation ready to take Help wanted. Guidance available. There is a high chance the change will be accepted

Comments

@btmorex
Copy link

btmorex commented Jan 28, 2020

I wanted to render Backdrop server side and use it as sort of a loading indicator before the javascript is downloaded. This does not work; I guess because of the Fade wrapping it. Setting transitionDuration to 0 doesn't help either.

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.
@oliviertassinari oliviertassinari added component: backdrop This is the name of the generic UI component, not the React module! docs Improvements or additions to the documentation labels Jan 28, 2020
@oliviertassinari
Copy link
Member

oliviertassinari commented Jan 28, 2020

Tip: check the transition appearing props.

It's something we could better document. It sounds like a common use case.

@oliviertassinari oliviertassinari changed the title Backdrop doesn't appear before JS is loaded [Backdrop] Doesn't appear before JS is loaded Jan 28, 2020
@btmorex
Copy link
Author

btmorex commented Jan 28, 2020

Thanks! Even with your tip that took me ages to figure out. The solution if anyone else runs across this issue is to set appear to false on Backdrop (it gets passed from Backdrop to Fade to Transition).

@oliviertassinari
Copy link
Member

@btmorex Agree!

@Josh-Weston
Copy link
Contributor

Thoughts on adding Fade as an inherited component for Backdrop?

  describeConformance(<Backdrop open />, () => ({
    classes,
    inheritComponent: Fade,
    mount,
    refInstanceof: window.HTMLDivElement,
    skip: [
      'componentProp',
      // react-transition-group issue
      'reactTestRenderer',
    ],
  }));

This would allow someone to traverse from: Backdrop to Fade to Transition within the API docs.

The following would be added to Backdrop's API docs:

image

image

@oliviertassinari
Copy link
Member

@Josh-Weston Smart, do you want. to go for it? :)

@oliviertassinari oliviertassinari added the ready to take Help wanted. Guidance available. There is a high chance the change will be accepted label Apr 11, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: backdrop This is the name of the generic UI component, not the React module! docs Improvements or additions to the documentation ready to take Help wanted. Guidance available. There is a high chance the change will be accepted
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants