NotSupportedError: CustomElementRegistry.define: 'giscus-widget' has already been defined as a custom element

[rajan-31]

I have used react component in next.js application.

I am getting this error randomly sometimes when I visit/route to any of my blog pages where giscus component is used.

Not sure how to exactly reproduce, it goes away if I refresh the page.

I see these logs when the error occurs.

---

---

Unhandled Runtime Error

NotSupportedError: CustomElementRegistry.define: 'giscus-widget' has already been defined as a custom element
Call Stack
Ot/</<
node_modules/@giscus/react/dist/giscus-36df6801.js (5:8301)
Ot/<
node_modules/@giscus/react/dist/giscus-36df6801.js (5:8301)
p
node_modules/@giscus/react/dist/giscus-36df6801.js (5:11591)

node_modules/@giscus/react/dist/giscus-36df6801.js (28:928)
./node_modules/@giscus/react/dist/giscus-36df6801.js
file:/home/rajan/0.Projects/Next.js/nextjs-portfolio/.next/static/chunks/pages/articles/%5Bid%5D.js (18:1)
options.factory
/_next/static/chunks/webpack.js (606:31)
webpack_require
file:/home/rajan/0.Projects/Next.js/nextjs-portfolio/.next/static/chunks/webpack.js (37:33)
fn
/_next/static/chunks/webpack.js (275:21)
b/</<
node_modules/@giscus/react/dist/index.js (1:325)
promise callback*b/<
node_modules/@giscus/react/dist/index.js (1:286)
invokePassiveEffectCreate
node_modules/react-dom/cjs/react-dom.development.js (23487:0)
callCallback
node_modules/react-dom/cjs/react-dom.development.js (3945:0)
invokeGuardedCallbackDev
node_modules/react-dom/cjs/react-dom.development.js (3994:0)
invokeGuardedCallback
node_modules/react-dom/cjs/react-dom.development.js (4056:0)
flushPassiveEffectsImpl
node_modules/react-dom/cjs/react-dom.development.js (23574:0)
unstable_runWithPriority
node_modules/scheduler/cjs/scheduler.development.js (468:0)
runWithPriority$1
node_modules/react-dom/cjs/react-dom.development.js (11276:0)
flushPassiveEffects
node_modules/react-dom/cjs/react-dom.development.js (23447:0)
commitBeforeMutationEffects/<
node_modules/react-dom/cjs/react-dom.development.js (23324:0)
workLoop
node_modules/scheduler/cjs/scheduler.development.js (417:0)
flushWork
node_modules/scheduler/cjs/scheduler.development.js (390:0)
performWorkUntilDeadline
node_modules/scheduler/cjs/scheduler.development.js (157:0)

[laymonage]

This indicates a possible misconfiguration in your website, as this shouldn't happen if there is only one package in the client bundle.

Still, I made it so that the element registration is skipped if the element is already defined. Should be fixed in v2.3.0, please update and confirm. Thanks!