Fix #12716 does not update the config generation section (#12718)

This is a really odd bug, where Firefox doesn't re-render the `code` element, even though `children` changed.

Two things fixed that:
- remove the `language-ini` `className`
- replace the `code` block with a `div`

Both are not ideal. Therefor this solution adds an inner `div` that now has the classes while still maintaining the semantic `code` element.

I couldn't find any explanation for why this is happening and why it only happens in Firefox. I assume it is a bug caused by one of our many dependencies (or their interplay)

To make matters worse: This bug *doesn't* occure when running the site in dev mode. You have to build and serve the site to recreate it.
This commit is contained in:
Marcus Blättermann 2023-06-19 09:34:28 +02:00 committed by GitHub
parent e73c1a89bf
commit 7e4b38c841
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -215,15 +215,17 @@ const Quickstart = ({
}
)}
<pre className={classes['code']}>
<code
className={classNames(classes['results'], {
[classes['small']]: !!small,
[`language-${codeLang}`]: !!codeLang,
})}
data-quickstart-results=""
ref={contentRef}
>
{Children.toArray(children).flat().filter(isRelevant)}
<code>
<div
className={classNames(classes['results'], {
[classes['small']]: !!small,
[`language-${codeLang}`]: !!codeLang,
})}
data-quickstart-results=""
ref={contentRef}
>
{Children.toArray(children).flat().filter(isRelevant)}
</div>
</code>
<menu className={classes['menu']}>