Skip to content

[BUG] When using SSR I get a dom mismatch #649

@izaacdb

Description

@izaacdb

Describe the bug

When using NextJS I see
Warning: Expected server HTML to contain a matching <span> in <nav>. in span (created by Styled(styled.span)) in Styled(styled.span) (created by Pagination).
This warning only shows up when I use pagination.

To Reproduce

Steps to reproduce the behavior:

  1. npx create-next-app --example with-typescript-styled-components with-typescript-app
  2. yarn add react-data-table-component
  3. copy the example data table, add 11 records
  4. enable pagination
  5. yarn dev
  6. see error in console, compare view source to rendered code

Expected behavior

<span class="sc-fznxKY sc-fznMAR jMFmnk">1-10 of 537</span> should be rendered on server and client

Versions (please complete the following information)

  • next@9.5.1
  • styled-components@5.1.1
  • react-table@7.5.0

Metadata

Metadata

Assignees

No one assigned

    Labels

    wontfixThis will not be worked on

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions