Semantic-ui-react: TypeError: _this.ref.current.querySelector is not a function
Bug Report
After upgrading to the last version, I have this error in some of our jest tests. Somehow there is a way for querySelector to not be function.
/**
* Encapsulate a semantic form field into a component to use it in redux-form.
*/
const SemanticFormField = ({
input,
type,
label,
htmlLabel,
placeholder,
meta: {touched, error, warning},
pointing,
disabled,
as: As = Input,
width,
fieldClassName,
inline,
autoFocus,
...props
}) => {
const handleChange = (e, {value}) => {
return input.onChange(value)
}
input.disabled = disabled
input["data-testid"] = input.name
return (
<Form.Field
error={!!(touched && error)}
width={width}
className={fieldClassName ? fieldClassName : ""}
inline={inline ? true : false}
>
{htmlLabel}
<As
{...props}
{...input}
value={typeof input.value !== "boolean" ? input.value : undefined}
checked={typeof input.value === "boolean" ? input.value : undefined}
type={type}
label={label}
placeholder={placeholder}
onChange={handleChange}
autoFocus={autoFocus}
/>
{touched &&
((error && (
<Label className="semantic-form-field-label" basic color="red" pointing={pointing}>
{error}
</Label>
)) ||
(warning && (
<Label className="semantic-form-field-label" basic color="orange" pointing={pointing}>
{warning}
</Label>
)))}
</Form.Field>
)
}
A redux form field which use a Semantic Select component
<Field
as={Select}
component={SemanticFormField}
disabled={disabled}
fluid
htmlLabel={<label>{texts.missionInformationsWorkedDaysTypePlaceHolder}</label>}
multiple
name="workedDaysType"
options={workedDaysTypeOptions}
placeholder={texts.missionInformationsWorkedDaysTypePlaceHolder}
validate={required}
/>
Steps
It's a complex use with redux-form and a generic component we called SemanticFormField to create a bridge between redux-form and SUIR
Expected Result
No TypeError
Actual Result
Error: Uncaught [TypeError: _this.ref.current.querySelector is not a function]
at reportException (/Users/myuser/workspace/folder/project/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:66:24)
at invokeEventListeners (/Users/myuser/workspace/folder/project/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:209:9)
at HTMLUnknownElementImpl._dispatch (/Users/myuser/workspace/folder/project/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:119:9)
at HTMLUnknownElementImpl.dispatchEvent (/Users/myuser/workspace/folder/project/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:82:17)
at HTMLUnknownElementImpl.dispatchEvent (/Users/myuser/workspace/folder/project/node_modules/jsdom/lib/jsdom/living/nodes/HTMLElement-impl.js:30:27)
at HTMLUnknownElement.dispatchEvent (/Users/myuser/workspace/folder/project/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:157:21)
at Object.invokeGuardedCallbackDev (/Users/myuser/workspace/folder/project/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2424:16)
at invokeGuardedCallback (/Users/myuser/workspace/folder/project/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2477:31)
at commitRoot (/Users/myuser/workspace/folder/project/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10860:7)
at /Users/myuser/workspace/folder/project/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12311:5 TypeError: _this.ref.current.querySelector is not a function
at Dropdown._this.scrollSelectedItemIntoView (/Users/myuser/workspace/folder/project/node_modules/semantic-ui-react/dist/commonjs/modules/Dropdown/Dropdown.js:728:36)
at Dropdown.componentDidUpdate (/Users/myuser/workspace/folder/project/node_modules/semantic-ui-react/dist/commonjs/modules/Dropdown/Dropdown.js:1091:12)
Version
SUIR 1.2.1
React 16.8.2
React Test Renderer 16..8.2
Testcase
I can't manage to create a small test at the moment
callain
All 22 comments
馃憢 Thanks for opening your first issue here! If you're reporting a 馃悶 bug, please make sure you've completed all the fields in the issue template so we can best help.
We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.
![welcome[bot] picture](https://avatars0.githubusercontent.com/in/4141?v=4&s=40)
welcome[bot]
on 9 Sep 2020
So it comes from there. Can you please add console.log() or a breakpoint there to debug what is this.ref in this case? As you may notice there is a check for this.ref.current existence, so it looks confusing...
layershifter
on 9 Sep 2020
Did it, does it help ?
callain
on 9 Sep 2020
@callain yep, it's helpful. Can you please share all props from that object? If you can dump React tree it can be also helpful, for Enzyme you can use .debug(): https://enzymejs.github.io/enzyme/docs/api/ShallowWrapper/debug.html.
It fails because Dropdown in this.ref.current equals to a React element while should to a DOM node 馃 The single way that I see is that Dropdown gets as prop with a component that uses React.forwardRef but is not propagating refs. Are you using forwardRef option in redux-form?
layershifter
on 9 Sep 2020
I am also seeing this on my jest test output, not related to using redux-form (not a dependency of ours):
console.error
Error: Uncaught [TypeError: _this.ref.current.querySelector is not a function]
at reportException (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:62:24)
at innerInvokeEventListeners (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:332:9)
at invokeEventListeners (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:267:3)
at HTMLUnknownElementImpl._dispatch (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:214:9)
at HTMLUnknownElementImpl.dispatchEvent (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:87:17)
at HTMLUnknownElement.dispatchEvent (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:144:23)
at Object.invokeGuardedCallbackDev (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10021:16)
at invokeGuardedCallback (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10073:31)
at commitRootImpl (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13033:9)
at unstable_runWithPriority (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/scheduler/cjs/scheduler.development.js:653:12) TypeError: _this.ref.current.querySelector is not a function
at Dropdown._this.scrollSelectedItemIntoView (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/semantic-ui-react/dist/commonjs/modules/Dropdown/Dropdown.js:728:36)
at Dropdown._this.open (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/semantic-ui-react/dist/commonjs/modules/Dropdown/Dropdown.js:787:13)
at Dropdown.componentDidMount (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/semantic-ui-react/dist/commonjs/modules/Dropdown/Dropdown.js:1041:12)
at commitLifeCycles (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10428:22)
at commitLayoutEffects (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13295:7)
at HTMLUnknownElement.callCallback (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9972:14)
at innerInvokeEventListeners (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:316:27)
at invokeEventListeners (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:267:3)
at HTMLUnknownElementImpl._dispatch (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:214:9)
at HTMLUnknownElementImpl.dispatchEvent (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:87:17)
at HTMLUnknownElement.dispatchEvent (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:144:23)
at Object.invokeGuardedCallbackDev (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10021:16)
at invokeGuardedCallback (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10073:31)
at commitRootImpl (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13033:9)
at unstable_runWithPriority (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/scheduler/cjs/scheduler.development.js:653:12)
at runWithPriority (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1775:10)
at commitRoot (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12873:3)
at finishSyncRender (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12384:3)
at performSyncWorkOnRoot (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12370:7)
at /Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1825:24
at unstable_runWithPriority (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/scheduler/cjs/scheduler.development.js:653:12)
at runWithPriority (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1775:10)
at flushSyncCallbackQueueImpl (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1820:7)
at flushSyncCallbackQueue (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:1808:3)
at scheduleUpdateOnFiber (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:11776:9)
at updateContainer (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14747:3)
at create (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15455:5)
at getRenderedTree (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/@storybook/addon-storyshots/dist/frameworks/react/renderTree.js:26:16)
at /Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/@storybook/addon-storyshots/dist/test-bodies.js:11:22
at /Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/@storybook/addon-storyshots/dist/test-bodies.js:41:52
at Object.<anonymous> (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/@storybook/addon-storyshots/dist/api/snapshotsTestsTemplate.js:42:20)
at Object.asyncJestTest (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jest/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:106:37)
at /Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jest/node_modules/jest-jasmine2/build/queueRunner.js:45:12
at new Promise (<anonymous>)
at mapper (/Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jest/node_modules/jest-jasmine2/build/queueRunner.js:28:19)
at /Users/kpeeler/Development/PactSafe/pactsafe-app-hercules/node_modules/jest/node_modules/jest-jasmine2/build/queueRunner.js:75:41
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at VirtualConsole.<anonymous> (node_modules/jsdom/lib/jsdom/virtual-console.js:29:45)
at reportException (node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:66:28)
at innerInvokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:332:9)
at invokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:267:3)
at HTMLUnknownElementImpl._dispatch (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:214:9)
at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:87:17)
at HTMLUnknownElement.dispatchEvent (node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:144:23)
perhaps there is a specific API I can mock that JSDom doesn't implement that's causing this error? For now, this is a blocker to upgrading to v1 from 0.88.2. 馃槩
kylepeeler
on 16 Sep 2020
Can anyone please create a minimal repro of this on CodeSandbox?
layershifter
on 17 Sep 2020
I prepared a CodeSandbox: https://codesandbox.io/s/upbeat-stallman-mdxom?file=/src/index.spec.js
Please update index.spec.js to repro the error and then I can fix it.
layershifter
on 17 Sep 2020
Thanks for getting this prepped!! 鉂わ笍 , will take a look tonight and see if I can get a working example going for you.
kylepeeler
on 17 Sep 2020
Never used Enzyme before, managed to export the tree on my project thanks to your codesandbox example.
And it did not crash with Enzyme.
So it might be related to a difference between react-test-renderer and Enzyme
<SemanticFormField input={{...}} meta={{...}} as={[Function: Select]} disabled={false} fluid={true} htmlLabel={{...}} multiple={true} options={{...}} placeholder="Jours travaill茅s" pointing={true}>
<FormField error={false} width={[undefined]} className="" inline={false}>
<div className="field" id={[undefined]}>
<label>
Jours travaill茅s
</label>
<Select fluid={true} multiple={true} options={{...}} name="workedDaysType" onBlur={[Function]} onChange={[Function: handleChange]} onDragStart={[Function]} onDrop={[Function]} onFocus={[Function]} value="" disabled={false} data-testid="workedDaysType" checked={[undefined]} type={[undefined]} label={[undefined]} placeholder="Jours travaill茅s" autoFocus={[undefined]}>
<Dropdown fluid={true} multiple={true} options={{...}} name="workedDaysType" onBlur={[Function]} onChange={[Function: handleChange]} onDragStart={[Function]} onDrop={[Function]} onFocus={[Function]} value="" disabled={false} data-testid="workedDaysType" checked={[undefined]} type={[undefined]} label={[undefined]} placeholder="Jours travaill茅s" autoFocus={[undefined]} selection={true} additionLabel="Add " additionPosition="top" closeOnBlur={true} closeOnEscape={true} deburr={false} icon="dropdown" minCharacters={1} noResultsMessage="No results found." openOnFocus={true} renderLabel={[Function: renderItemContent]} searchInput="text" selectOnBlur={true} selectOnNavigation={true} wrapSelection={true}>
<Ref innerRef={{...}}>
<RefFindNode innerRef={{...}}>
<div name="workedDaysType" onDragStart={[Function]} onDrop={[Function]} data-testid="workedDaysType" checked={[undefined]} type={[undefined]} label={[undefined]} autoFocus={[undefined]} role="listbox" aria-busy={[undefined]} aria-disabled={false} aria-expanded={false} aria-multiselectable={true} className="ui fluid multiple selection dropdown" onBlur={[Function]} onClick={[Function]} onKeyDown={[Function]} onMouseDown={[Function]} onFocus={[Function]} onChange={[Function]} tabIndex={0}>
<DropdownText className="default text" content="Jours travaill茅s">
<div aria-atomic={true} aria-live="polite" role="alert" className="divider default text">
Jours travaill茅s
</div>
</DropdownText>
<Icon name="dropdown" className="" onClick={[Function: onClick]} as="i">
<i onClick={[Function]} aria-hidden="true" className="dropdown icon" />
</Icon>
<DropdownMenu direction={[undefined]} open={[undefined]}>
<div className="menu transition">
<DropdownItem active={false} onClick={[Function]} selected={true} value="WEEK" text="Semaine" style={{...}}>
<div style={{...}} role="option" aria-disabled={[undefined]} aria-checked={false} aria-selected={true} className="selected item" onClick={[Function]}>
<span className="text">
Semaine
</span>
</div>
</DropdownItem>
<DropdownItem active={false} onClick={[Function]} selected={false} value="WEEK_END" text="Week-end" style={{...}}>
<div style={{...}} role="option" aria-disabled={[undefined]} aria-checked={false} aria-selected={false} className="item" onClick={[Function]}>
<span className="text">
Week-end
</span>
</div>
</DropdownItem>
<DropdownItem active={false} onClick={[Function]} selected={false} value="PUBLIC_HOLIDAY" text="Jour f茅ri茅" style={{...}}>
<div style={{...}} role="option" aria-disabled={[undefined]} aria-checked={false} aria-selected={false} className="item" onClick={[Function]}>
<span className="text">
Jour f茅ri茅
</span>
</div>
</DropdownItem>
</div>
</DropdownMenu>
</div>
</RefFindNode>
</Ref>
</Dropdown>
</Select>
</div>
</FormField>
</SemanticFormField>
Oops, I missed that it's related to react-test-renderer. Creating a CodeSandbox for it...
layershifter
on 18 Sep 2020
And about this question
Are you using forwardRef option in redux-form?
No, I tried with withRef (Redux-form 7.4.2) but since SemanticFormField is a function component that can't work.
But as @kylepeeler said, it's not related to redux-form
callain
on 18 Sep 2020
https://codesandbox.io/s/infallible-wildflower-uoql6?file=/src/index.spec.js
A CSB was updated, can you please update it to repro there?
layershifter
on 18 Sep 2020
Yes, I will try!
callain
on 18 Sep 2020
Not as minimal as you may wish as it seems to behave wierdly but it reproduces the issue.
Codesandbox doesn't start tests on firefox (with full error in the console) so I did it with the new Edge.
https://codesandbox.io/s/dazzling-moser-tgz28?file=/src/index.spec.js
Consider exporting it to ZIP then unzip, install dependencies and start tests :)
callain
on 18 Sep 2020
I was able to simplify it enough: https://codesandbox.io/s/hardcore-saha-cyu79?file=/src/index.spec.js
layershifter
on 18 Sep 2020
So... It's not a Dropdown bug 馃槰
It's an issue with react-test-renderer as it does not know about react-dom usage: React.findDOMNode will return a Fiber instead of node:
https://codesandbox.io/s/hardcore-saha-cyu79?file=/src/index.spec.js
The workaround exists and I think that mocking with Jest will be the safest option:
https://github.com/facebook/react/issues/7371#issuecomment-317396864
jest.mock('react-dom', () => ({
findDOMNode: () => ({}),
});
I will think how we can properly to fix it till next release to avoid mocks on consumer's side.
@kylepeeler @callain thank you for participating in this 馃憤
layershifter
on 18 Sep 2020
I am starting to develop an allergy to refs in React 馃槵
I tried mocking following https://github.com/facebook/create-react-app/issues/7539 but it's unclear where should mocks be...
Anyway, glad I could help, those tests aren't critical at all so they will remain skipped until an eventual SUIR upgrade
callain
on 18 Sep 2020
@callain I added a fix in #4068, if you don't want to wait you bump dependencies manually on your side 馃樅
layershifter
on 23 Sep 2020
Thank you ! I am glad to see my issue has led to fix in a microsoft project 馃槃
callain
on 23 Sep 2020
In my case - with the latest version (v2.0.0) and workaround proposed in https://github.com/facebook/react/issues/7371#issuecomment-317396864 it does not work (testing components using SUIR's Dropdown with Jest and Storyshots addon for Storybook).
Still getting similar error as in the first message:
TypeError: _this.ref.current.querySelector is not a function
at Dropdown._this.scrollSelectedItemIntoView (node_modules/semantic-ui-react/dist/commonjs/modules/Dropdown/Dropdown.js:728:36)
at Dropdown.componentDidUpdate (node_modules/semantic-ui-react/dist/commonjs/modules/Dropdown/Dropdown.js:1091:12)
at commitLifeCycles (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:12094:22)
at commitLayoutEffects (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15276:7)
at HTMLUnknownElement.callCallback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:11616:14)
at invokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:193:27)
at HTMLUnknownElementImpl._dispatch (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:119:9)
at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:82:17)
at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/nodes/HTMLElement-impl.js:30:27)
at HTMLUnknownElement.dispatchEvent (node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:157:21)
at Object.invokeGuardedCallbackDev (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:11665:16)
at invokeGuardedCallback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:11718:31)
at commitRootImpl (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15012:9)
at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:815:12)
at runWithPriority (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2038:10)
at commitRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14853:3)
at finishSyncRender (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14346:5)
at performSyncWorkOnRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:14318:9)
at node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2088:24
at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:815:12)
at runWithPriority (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2038:10)
at flushSyncCallbackQueueImpl (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2083:7)
at flushSyncCallbackQueue (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2071:3)
at scheduleUpdateOnFiber (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:13696:9)
at scheduleRootUpdate (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:16931:3)
at updateContainerAtExpirationTime (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:16959:10)
at updateContainer (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:16979:10)
at create (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:17722:5)
at getRenderedTree (node_modules/@storybook/addon-storyshots/dist/frameworks/react/renderTree.js:23:16)
at node_modules/@storybook/addon-storyshots/dist/test-bodies.js:10:22
at Object.<anonymous> (node_modules/@storybook/addon-storyshots/dist/api/snapshotsTestsTemplate.js:42:20)
Possibly more sophisticated Jest mocking is necessary?
qooban
on 19 Oct 2020
@qooban this looks like a different kind of issue. Can you please update a CodeSandbox previously mentioned in this issue to reproduce the problem?
layershifter
on 19 Oct 2020
@layershifter I investigated the problem deeper. Looks like that indeed, it is different kind of issue, most probably not related to Semantic UI React, but to React Test Renderer and Storyshots (Storybook addon). I found few ways around this issue (either using Enzyme as a renderer, disable specific stories in my Storybook, using createNodeMock with Storyshots), so thanks for the attention 馃憤馃徎
qooban
on 21 Oct 2020
Related issues
JMS-1
路
30Comments
ryardley
路
27Comments
skleeschulte
路
22Comments
coolpopo
路
26Comments
Vino4
路
19Comments