Skip to content

Hydration Error related with Download Button #2693

Open
@ivankropyvnytskyi

Description

@ivankropyvnytskyi

Describe the bug
Hydration errors appear on Browser's Console with messages:

Uncaught Error: Minified React error #418; visit https://reactjs.org/docs/error-decoder.html?invariant=418 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
Uncaught Error: Minified React error #423; visit https://reactjs.org/docs/error-decoder.html?invariant=423 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

To Reproduce
Steps to reproduce the behavior:

  1. Given this redocly.yaml file:
extends:
  - recommended

apis:
  main:
    root: openapi.yaml
theme:
  openapi:
    hideDownloadButton: false 
  1. And this OpenAPI file:
openapi: 3.0.3
info:
  title: Sample API
  version: 1.0.0
  description: A simple example of OpenAPI with Redocly.
servers:
  - url: https://api.example.com/v1
paths:
  /hello:
    get:
      summary: Returns a greeting
      responses:
        '200':
          description: Successful response
          content:
            application/json:
              schema:
                type: object
                properties:
                  message:
                    type: string
  1. Run this command with these arguments:
    Using @redocly/cli version 1.34.3 run:
    redocly build-docs --disableGoogleFont openapi.yaml -o dist/index.html

  2. See error
    Serve the created dist/index.html file and open it with a Browser (tested on Firefox and Chrome).
    Choose to Inspect the created API Docs and go to the tab Console. The hydration messages (mentioned in the description above) will be reported.

  3. Repeat without the Download Button
    Set hideDownloadButton to true in redocly.yaml and rebuild the docs:
    redocly build-docs --disableGoogleFont openapi.yaml -o dist/index.html
    Serve the static file and inspect it in your browser. No errors should be logged there.

Expected behavior
Download button does not cause any hydration errors.

Screenshots
Image

Additional context
Redocly/redocly-cli#2113

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions