Error Message Cannot read property 'wrongResults' of undefined in console when trying to access a story.
Opened this issue · 5 comments
Issue details
There is an error message when I open Storybook and I try to access one of my Stories.
Uncaught TypeError: Cannot read property 'wrongResults' of undefined
at Specifications.render (manager.bundle.js:63366)
at finishClassComponent (manager.bundle.js:54231)
at updateClassComponent (manager.bundle.js:54208)
at beginWork (manager.bundle.js:54583)
at performUnitOfWork (manager.bundle.js:56582)
at workLoop (manager.bundle.js:56646)
at HTMLUnknownElement.callCallback (manager.bundle.js:46900)
at Object.invokeGuardedCallbackDev (manager.bundle.js:46939)
at invokeGuardedCallback (manager.bundle.js:46796)
at renderRoot (manager.bundle.js:56724)
The above error occurred in the <Specifications> component:
in Specifications
in Specifications
in div (created by DownPanel)
in div (created by DownPanel)
in div (created by DownPanel)
in DownPanel (created by Container(DownPanel))
in Container(DownPanel) (created by Layout)
in div (created by Layout)
in div (created by Pane)
in Pane (created by SplitPane)
in div (created by SplitPane)
in SplitPane (created by Layout)
in div (created by Pane)
in Pane (created by SplitPane)
in div (created by SplitPane)
in SplitPane (created by Layout)
in div (created by Layout)
in Layout (created by Container(Layout))
in Container(Layout)
in div
Steps To Reproduce:
My tests are in a separate file from the stories. I used the instructions from the README.md
- I open my StoryBook and by default it will take me to the first story of my StoryBook:
This default story hasn't tests written yet. For some reason the specs addon runs all the tests and shows the results in all the stories.
http://localhost:6006/?selectedKind=Styleguide&selectedStory=Fonts&full=0&down=1&left=1&panelRight=0&downPanel=storybooks%2Fstorybook-addon-knobs
- My tests results are not coming up in the specification tab yet.
-
I reload the page (F5)
- My Test Results are now coming up in the Specifications tab of my default selected story (same URL as above)
-
I click on a different story from the left hand side panel (this time, this is the one that my tests use) .
RESULT:
White Screen comes up, yarn log does not display the error message. The error is displayed in the browsers console. And Story book does not longer shows any data at all.
This is the URL of my story:
http://localhost:6006/?selectedKind=Button&selectedStory=Default&full=0&down=1&left=1&panelRight=0&downPanel=storybook-addon-specifications%2Fspecifications-panel
VERSIONS
storybook/react 3.2.17
storybook/addon-actions: ^3.2.17
storybook/addon-info: ^3.2.13
storybook/addon-knobs: ^3.2.17
storybook/addon-links: ^3.2.13
storybook/addons: ^3.2.17
react 16.1.1
enzyme": "^3.2.0
enzyme-adapter-react-16": "^1.1.0
Has the same issue with
- storybook/addon-actions "3.3.3",
- storybook/addon-knobs "3.3.3",
- storybook/addon-links "3.3.3",
- storybook/react "3.3.3",
- react "16.2.0",
- enzyme "3.3.0",
- enzyme-adapter-react-16 "1.1.1",
+1
I encountered the same issue when I add tests to the story with jest, and skipping describe()
:
import { ... } from './.storybook/facade'
storiesOf('TimerDisplay', module)
.add('story 1', () => {
// this works fine
specs(() => describe('story 1', () => {
it('story 1', () => { ... })
})
})
.add('story 2', () => {
// this throws 'Cannot read property 'wrongResults' of undefined'
specs(() => it('story 2', () => { ... })
})
I want to skip the describe()
because the TimerDisplay
is a simple and stateless component. Thus each story describes the expectation of how it should render, and the test just verify the same thing.
So in such case, the story and the test are 1-1 map and does not need to have an extra grouping by wrapping it in describe()
.
getting the same thing...
I was running into this error because I wasn't returning describe()
inside specs()
:
// causes "Cannot read property 'wrongResults' of undefined" error
specs(() => {
describe('some test', () => {})
})
// works!
specs(() =>
describe('some test', () => {})
)