redoc icon indicating copy to clipboard operation
redoc copied to clipboard

Hydration Error related with Download Button

Open ivankropyvnytskyi opened this issue 7 months ago • 1 comments

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 https://github.com/Redocly/redocly-cli/issues/2113

ivankropyvnytskyi avatar May 26 '25 12:05 ivankropyvnytskyi

get these exact same errors when Cypress loads the static-generated API doc file from our server (we use Cypress to test that the API page is being rendered and served correctly.)

thom-nic avatar Jul 02 '25 20:07 thom-nic