storybook-addon-specifications
storybook-addon-specifications copied to clipboard
Nesting `describe` calls breaks the display of tests in storybook
I've extracted my tests into a separate file using this method: https://github.com/mthuret/storybook-addon-specifications/issues/17
/.storybook/config.js
import './test-register'
/.storybook/test-register.js
const {
after: afterAll,
before: beforeAll,
afterEach,
beforeEach,
it,
specs,
describe
} = require('storybook-addon-specifications');
const expect = require('expect');
const additions = { expect, afterAll, afterEach, beforeAll, beforeEach, it, specs, describe };
Object.assign(global, additions);
module.exports = additions;
/src/Component/Component.stories.js
import React from 'react';
import Component from './Component';
import { storiesOf, action } from '@kadira/storybook';
storiesOf('Component', module)
.addDecorator((story) => {
specs(() => require('./Component.test'));
return story();
})
.add('with text', () => (
<Component>Amazing</Component>
));
Now with this Component.test.js it works:
import React from 'react';
import Component from './Component';
import { mount } from 'enzyme';
const name = 'Component';
describe(name, () => {
it('Should be awesome', () => {
const output = mount(<Component>Awesome</Component>);
expect(output.text()).toContain('Awesome');
});
});
export { name as default };
But when I nest multiple describes like this: it no longer works.
import React from 'react';
import Component from './Component';
import { mount } from 'enzyme';
const name = 'Component';
describe(name, () => {
describe('section 1', () => {
it('Should be awesome', () => {
const output = mount(<Component>Awesome</Component>);
expect(output.text()).toContain('Awesome');
});
});
});
export { name as default };
So this story is more complex then just supporting nested describes I think.
What I'd really want is to run a real jest test and see the output inside storybook. The current setup of this awesome 👍 plugin doesn't actually run a jest test. Because jest cannot be run inside a browser..
Is there some way of running jest-cli and relaying it's results to the browsers so we can display them in storybook?
clearly nested it/describe are not supported by the addon. So that would be a new feature to develop :)
As for the jest output inside storybook, unfortunately i'm not sure there's an easy way to do that because we are on the browser side. That's why this addons only do assertions on mounted components. (the rest is just tricks to make the jest-cli/mocha-cli works as usual).
Does storybook provide addons with ways of running serverside code?