question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

SSR for react-button fails due to usage of HTMLElement

See original GitHub issue

Hello there

SSR for @material/react-button currently fails with

if (matchesMethod in HTMLElementPrototype) {
                      ^
TypeError: Cannot use 'in' operator to search for 'matches' in undefined

Here is a minimal reproduction of this — https://github.com/sidharthachatterjee/mdc-ssr-test

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:10
  • Comments:16 (9 by maintainers)

github_iconTop GitHub Comments

5reactions
moog16commented, Mar 6, 2019

AH - sorry for not answer that part…I’m working on converting the components over to the new release (v1.0.0), which will fix this issue. I’m not sure how long this will take me as I have. The next 2 releases are 3/19 and 4/16. I anticipate being finished with it before 4/16, but can’t guarantee it will be done by 3/19. I know this is a popular issue so I think I could either move the 3/19 release or do another release after 3/19 – I will have to talk to the team about this one.

You can track the progress of all components being updated here: https://github.com/material-components/material-components-web-react/issues/697

3reactions
moog16commented, Feb 15, 2019

@julien1619 Just want to set expectations – Next release for MDC Web is on March 4th, it’ll be out then. Thanks again for fixing this issue!

We will also then need to update MDC React’s Button component, but there are no breaking changes that I’m aware of, so this should basically just be a package.json bump.

Read more comments on GitHub >

github_iconTop Results From Across the Web

useFocusRing not working with SSR · Issue #767 - GitHub
When using component with useFocusRing hook within, application crashes if component is rendered on server side. Expected Behavior.
Read more >
Warning: Text content did not match. Server: "I'm out" Client
The hydration issue occurs because the HTML rendered on the browser doesn't match the one generated on the server. In your case this...
Read more >
Intro to React Server Side Rendering | by Suhan Wijaya
We will use React, webpack, and Express to build an SSR app that works as follows: Browser sends HTTP request to server to...
Read more >
ReactDOMServer – React
ReactDOMServer. The ReactDOMServer object enables you to render components to static markup. Typically, it's used on a Node server:.
Read more >
Hydrating text content from Server-Side Rendering | Tan Li Hau
So, when React tries to hydrate the div from SSR, it starts with comparing all the props from the React element and the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found