diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md index a322ea385..f5548d457 100644 --- a/docs/resources/changelog.md +++ b/docs/resources/changelog.md @@ -17,6 +17,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis - Improved the default icon for `` so it's more intuitive and removed `grip-vertical` from system icon library - Improved RTL styles for many components [#768](https://github.com/shoelace-style/shoelace/pull/768) - Improved base path logic to execute only when `getBasePath()` is first called to better support SSR [#778](https://github.com/shoelace-style/shoelace/issues/778) +- Improved `DOMParser` instantiation in `` to better support SSR [#778](https://github.com/shoelace-style/shoelace/issues/778) - Revert menu item caching due to regression [#766](https://github.com/shoelace-style/shoelace/issues/766) ## 2.0.0-beta.74 diff --git a/src/components/icon/icon.ts b/src/components/icon/icon.ts index 5f80f4ca2..4882210fc 100644 --- a/src/components/icon/icon.ts +++ b/src/components/icon/icon.ts @@ -8,7 +8,7 @@ import styles from './icon.styles'; import { getIconLibrary, unwatchIcon, watchIcon } from './library'; import { requestIcon } from './request'; -const parser = new DOMParser(); +let parser: DOMParser; /** * @since 2.0 @@ -74,6 +74,13 @@ export default class SlIcon extends LitElement { async setIcon() { const library = getIconLibrary(this.library); const url = this.getUrl(); + + // Create an instance of the DOM parser. We do it here instead of top-level to support SSR while maintaining a + // single parser instance for optimal performance. + if (!parser) { + parser = new DOMParser(); + } + if (url) { try { const file = await requestIcon(url);