Skip to content

Commit

Permalink
Merge pull request #2343 from syneva-runyan/issue-2196_fix-unittest-w…
Browse files Browse the repository at this point in the history 
…arnings

Issue 2196 fix unittest warnings
  • Loading branch information
@Hypnosphi
Hypnosphi authored Nov 21, 2017
2 parents 69fd5df + f7a5106 commit cad0dc2
Show file tree
Hide file tree
Showing 5 changed files with 46 additions and 36 deletions.
7 changes: 6 additions & 1 deletion addons/info/src/components/markdown/text.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,12 @@ export function P(props) {
...baseFonts,
fontSize: '15px',
};
return <p style={style}>{props.children}</p>;

// <P> is oftentimes used as a parent element of
// <a> and <pre> elements, which is why <div>
// is used as the outputted element when parsing
// marksy content rather than <p>.
return <div style={style}>{props.children}</div>;
}

P.defaultProps = defaultProps;
Expand Down
10 changes: 6 additions & 4 deletions addons/info/src/index.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@ import ReactDOM from 'react-dom';
import AddonInfo, { withInfo, setDefaults } from './';

/* eslint-disable */
const TestComponent = ({ func, obj, array, number, string, bool, empty }) =>
const TestComponent = ({ func, obj, array, number, string, bool, empty }) => (
<div>
<h1>{func}</h1>
<h1>{func.toString()}</h1>
<h2>{obj.toString()}</h2>
<h3>{array}</h3>
<h4>{number}</h4>
Expand All @@ -20,7 +20,7 @@ const TestComponent = ({ func, obj, array, number, string, bool, empty }) =>
<li>1</li>
<li>2</li>
</ui>
</div>;
</div>);
/* eslint-enable */

const testContext = { kind: 'addon_info', story: 'jest_test' };
Expand All @@ -43,10 +43,12 @@ describe('addon Info', () => {
const api = {
add: (name, fn) => fn(testContext),
};

it('should render <Info /> and markdown', () => {
const Info = withInfo(
'# Test story \n## with markdown info \ncontaing **bold**, *cursive* text and `code`'
'# Test story \n## with markdown info \ncontaing **bold**, *cursive* text, `code` and [a link](https://github.com)'
)(story);

ReactDOM.render(<Info />, document.createElement('div'));
});
it('should render with text options', () => {
Expand Down
60 changes: 30 additions & 30 deletions examples/cra-kitchen-sink/src/__snapshots__/storyshots.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,7 +193,7 @@ exports[`Storyshots Addon Info.Decorator Use Info as story decorator 1`] = `
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -204,7 +204,7 @@ exports[`Storyshots Addon Info.Decorator Use Info as story decorator 1`] = `
}
>
Info could be used as a global or local decorator as well.
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -590,7 +590,7 @@ exports[`Storyshots Addon Info.GitHub issues #1814 1`] = `
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -601,7 +601,7 @@ exports[`Storyshots Addon Info.GitHub issues #1814 1`] = `
}
>
Allow Duplicate DisplayNames for HOC #1814
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -946,7 +946,7 @@ exports[`Storyshots Addon Info.Markdown Displays Markdown in description 1`] = `
>
You can use markdown in your withInfo() description.
</h4>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -957,7 +957,7 @@ exports[`Storyshots Addon Info.Markdown Displays Markdown in description 1`] = `
}
>
Sometimes you might want to manually include some code examples:
</p>
</div>
<pre>
<code
className="hljs js"
Expand All @@ -968,7 +968,7 @@ exports[`Storyshots Addon Info.Markdown Displays Markdown in description 1`] = `
}
/>
</pre>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -992,7 +992,7 @@ exports[`Storyshots Addon Info.Markdown Displays Markdown in description 1`] = `
link
</a>
to your project as well.
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -1374,7 +1374,7 @@ exports[`Storyshots Addon Info.Options.header Shows or hides Info Addon header 1
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -1385,7 +1385,7 @@ exports[`Storyshots Addon Info.Options.header Shows or hides Info Addon header 1
}
>
The Info Addon header should be hidden
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -1730,7 +1730,7 @@ exports[`Storyshots Addon Info.Options.inline Inlines component inside story 1`]
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -1741,7 +1741,7 @@ exports[`Storyshots Addon Info.Options.inline Inlines component inside story 1`]
}
>
Component should be inlined between description and PropType table
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -2127,7 +2127,7 @@ exports[`Storyshots Addon Info.Options.propTables Shows additional component pro
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -2138,7 +2138,7 @@ exports[`Storyshots Addon Info.Options.propTables Shows additional component pro
}
>
There should be a prop table added for a component not included in the story
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -2623,7 +2623,7 @@ exports[`Storyshots Addon Info.Options.propTablesExclude Exclude component from
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -2634,7 +2634,7 @@ exports[`Storyshots Addon Info.Options.propTablesExclude Exclude component from
}
>
This can exclude extraneous components from being displayed in prop tables.
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -3130,7 +3130,7 @@ exports[`Storyshots Addon Info.Options.source Shows or hides Info Addon source 1
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -3141,7 +3141,7 @@ exports[`Storyshots Addon Info.Options.source Shows or hides Info Addon source 1
}
>
The Info Addon source section should be hidden
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -3821,7 +3821,7 @@ exports[`Storyshots Addon Info.React Docgen Comments from Flow declarations 1`]
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -3832,7 +3832,7 @@ exports[`Storyshots Addon Info.React Docgen Comments from Flow declarations 1`]
}
>
Comments above the Flow declarations should be extracted from the React component file itself and rendered in the Info Addon prop table
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -4195,7 +4195,7 @@ exports[`Storyshots Addon Info.React Docgen Comments from PropType declarations
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -4206,7 +4206,7 @@ exports[`Storyshots Addon Info.React Docgen Comments from PropType declarations
}
>
Comments above the PropType declarations should be extracted from the React component file itself and rendered in the Info Addon prop table
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -4668,7 +4668,7 @@ exports[`Storyshots Addon Info.React Docgen Comments from component declaration
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -4679,7 +4679,7 @@ exports[`Storyshots Addon Info.React Docgen Comments from component declaration
}
>
Comments above the component declaration should be extracted from the React component file itself and rendered below the Info Addon heading
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -5319,7 +5319,7 @@ exports[`Storyshots Button addons composition 1`] = `
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -5330,7 +5330,7 @@ exports[`Storyshots Button addons composition 1`] = `
}
>
see Notes panel for composition info
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -5731,7 +5731,7 @@ exports[`Storyshots Button with new info 1`] = `
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -5755,7 +5755,7 @@ exports[`Storyshots Button with new info 1`] = `
info addon
</a>
with its new painless API.
</p>
</div>
</div>
<div>
<h1
Expand Down Expand Up @@ -6303,7 +6303,7 @@ exports[`Storyshots Button with some info 1`] = `
}
}
>
<p
<div
style={
Object {
"WebkitFontSmoothing": "antialiased",
Expand All @@ -6327,7 +6327,7 @@ exports[`Storyshots Button with some info 1`] = `
info addon
</a>
with its painful API.
</p>
</div>
</div>
<div>
<h1
Expand Down
2 changes: 1 addition & 1 deletion lib/ui/src/modules/ui/components/layout/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ const fullScreenPreviewStyle = {
margin: 0,
padding: 0,
overflow: 'auto',
webkitOverflowScrolling: 'touch',
WebkitOverflowScrolling: 'touch',
};

const defaultSizes = {
Expand Down
3 changes: 3 additions & 0 deletions scripts/jest.init.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,7 @@ import 'jest-enzyme/lib/index';
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

// mock console.info calls for cleaner test execution
global.console.info = jest.fn().mockImplementation(() => {})

configure({ adapter: new Adapter() });

0 comments on commit cad0dc2

Please sign in to comment.