nfl / react-helmet

A document head manager for React
MIT License
17.28k stars 657 forks source link

tag[primaryAttributeKey].toLowerCase is not a function (react-helmet + react-testing-library) #645

Open preciselywilliam opened 3 years ago

preciselywilliam commented 3 years ago

I'm trying to create tests using react-testing-library which includes react-helmet with a (favicon). I have mocked the images that are used in the link, but below error is thrown from react-helmet. Not really sure what the error refers to, but I'm wondering if it's better to exclude react-helmet from the tests since the tests aren't running in a real browser, or if there is a solution to this.

      Error: Uncaught [TypeError: tag[primaryAttributeKey].toLowerCase is not a function]
          at reportException (/my_path/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:62:24)
          at innerInvokeEventListeners (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:333:9)
          at invokeEventListeners (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
          at HTMLUnknownElementImpl._dispatch (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
          at HTMLUnknownElementImpl.dispatchEvent (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
          at HTMLUnknownElement.dispatchEvent (/my_path/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
          at Object.invokeGuardedCallbackDev (/my_path/node_modules/react-dom/cjs/react-dom.development.js:237:16)
          at invokeGuardedCallback (/my_path/node_modules/react-dom/cjs/react-dom.development.js:292:31)
          at beginWork$1 (/my_path/node_modules/react-dom/cjs/react-dom.development.js:23203:7)
          at performUnitOfWork (/my_path/node_modules/react-dom/cjs/react-dom.development.js:22157:12) TypeError: tag[primaryAttributeKey].toLowerCase is not a function
          at /my_path/node_modules/react-helmet/lib/Helmet.js:259:50
          at Array.filter (<anonymous>)
          at /my_path/node_modules/react-helmet/lib/Helmet.js:238:22
          at Array.reduce (<anonymous>)
          at getTagsFromPropsList (/my_path/node_modules/react-helmet/lib/Helmet.js:235:18)
          at reducePropsToState (/my_path/node_modules/react-helmet/lib/Helmet.js:311:19)
          at emitChange (/my_path/node_modules/react-side-effect/lib/index.js:56:15)
          at SideEffect.UNSAFE_componentWillMount (/my_path/node_modules/react-side-effect/lib/index.js:95:9)
          at callComponentWillMount (/my_path/node_modules/react-dom/cjs/react-dom.development.js:12953:14)
          at mountClassInstance (/my_path/node_modules/react-dom/cjs/react-dom.development.js:13048:5)
          at updateClassComponent (/my_path/node_modules/react-dom/cjs/react-dom.development.js:17101:5)
          at beginWork (/my_path/node_modules/react-dom/cjs/react-dom.development.js:18620:16)
          at HTMLUnknownElement.callCallback (/my_path/node_modules/react-dom/cjs/react-dom.development.js:188:14)
          at HTMLUnknownElement.callTheUserObjectsOperation (/my_path/node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
          at innerInvokeEventListeners (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:318:25)
          at invokeEventListeners (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
          at HTMLUnknownElementImpl._dispatch (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
          at HTMLUnknownElementImpl.dispatchEvent (/my_path/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
          at HTMLUnknownElement.dispatchEvent (/my_path/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
          at Object.invokeGuardedCallbackDev (/my_path/node_modules/react-dom/cjs/react-dom.development.js:237:16)
          at invokeGuardedCallback (/my_path/node_modules/react-dom/cjs/react-dom.development.js:292:31)
          at beginWork$1 (/my_path/node_modules/react-dom/cjs/react-dom.development.js:23203:7)
          at performUnitOfWork (/my_path/node_modules/react-dom/cjs/react-dom.development.js:22157:12)
          at workLoopSync (/my_path/node_modules/react-dom/cjs/react-dom.development.js:22130:22)
          at performSyncWorkOnRoot (/my_path/node_modules/react-dom/cjs/react-dom.development.js:21756:9)
          at scheduleUpdateOnFiber (/my_path/node_modules/react-dom/cjs/react-dom.development.js:21188:7)
          at updateContainer (/my_path/node_modules/react-dom/cjs/react-dom.development.js:24373:3)
          at /my_path/node_modules/react-dom/cjs/react-dom.development.js:24758:7
          at unbatchedUpdates (/my_path/node_modules/react-dom/cjs/react-dom.development.js:21903:12)
          at legacyRenderSubtreeIntoContainer (/my_path/node_modules/react-dom/cjs/react-dom.development.js:24757:5)
          at Object.render (/my_path/node_modules/react-dom/cjs/react-dom.development.js:24840:10)
          at /my_path/node_modules/@testing-library/react/dist/pure.js:99:25
          at batchedUpdates$1 (/my_path/node_modules/react-dom/cjs/react-dom.development.js:21856:12)
          at act (/my_path/node_modules/react-dom/cjs/react-dom-test-utils.development.js:929:14)
          at render (/my_path/node_modules/@testing-library/react/dist/pure.js:95:26)
          at /my_path/src/tests/util.js:43:52
          at Object.<anonymous> (/my_path/src/tests/util.test.js:36:2)
          at Object.asyncJestTest (/my_path/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:106:37)
          at /my_path/node_modules/jest-jasmine2/build/queueRunner.js:45:12
          at new Promise (<anonymous>)
          at mapper (/my_path/node_modules/jest-jasmine2/build/queueRunner.js:28:19)
          at /my_path/node_modules/jest-jasmine2/build/queueRunner.js:75:41
          at processTicksAndRejections (internal/process/task_queues.js:97:5)
seahorse-byte commented 2 years ago

have the same issue

Uttu316 commented 2 years ago

Any solution?

msquinn commented 2 years ago

Have to mock out react-helmet with jest. Try jest.mock("react-helmet");