mirror of
https://github.com/roleypoly/roleypoly-v1.git
synced 2025-04-25 12:19:10 +00:00
[design]: fix storyshots, update snapshots
This commit is contained in:
parent
dd6f02f4e2
commit
5b466670f3
2 changed files with 262 additions and 19 deletions
|
|
@ -1,51 +1,291 @@
|
||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
exports[`Storyshots Button Default 1`] = `
|
exports[`Storyshots Button Default 1`] = `
|
||||||
<button
|
<styled.button
|
||||||
className="sc-bdVaJa hPnBtV"
|
|
||||||
disabled={false}
|
disabled={false}
|
||||||
|
loadingPct={0}
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
|
primary={false}
|
||||||
|
secondary={false}
|
||||||
|
theme={
|
||||||
|
Object {
|
||||||
|
"actions": Object {
|
||||||
|
"primary": "#46b646",
|
||||||
|
"primaryText": "#efefef",
|
||||||
|
"secondary": "#e95353",
|
||||||
|
"secondaryText": "#efefef",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
>
|
>
|
||||||
Example
|
Example
|
||||||
</button>
|
</styled.button>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`Storyshots Button Disabled 1`] = `
|
exports[`Storyshots Button Disabled 1`] = `
|
||||||
<button
|
<styled.button
|
||||||
className="sc-bdVaJa hPnBtV"
|
|
||||||
disabled={true}
|
disabled={true}
|
||||||
|
loadingPct={0}
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
|
primary={false}
|
||||||
|
secondary={false}
|
||||||
|
theme={
|
||||||
|
Object {
|
||||||
|
"actions": Object {
|
||||||
|
"primary": "#46b646",
|
||||||
|
"primaryText": "#efefef",
|
||||||
|
"secondary": "#e95353",
|
||||||
|
"secondaryText": "#efefef",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
>
|
>
|
||||||
Example
|
Example
|
||||||
</button>
|
</styled.button>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`Storyshots Button Loading 1`] = `
|
exports[`Storyshots Button Loading 1`] = `
|
||||||
<button
|
<styled.button
|
||||||
className="sc-bdVaJa hPnBtV"
|
|
||||||
disabled={false}
|
disabled={false}
|
||||||
|
loadingPct={0}
|
||||||
onClick={[Function]}
|
onClick={[Function]}
|
||||||
|
primary={false}
|
||||||
|
secondary={false}
|
||||||
|
theme={
|
||||||
|
Object {
|
||||||
|
"actions": Object {
|
||||||
|
"primary": "#46b646",
|
||||||
|
"primaryText": "#efefef",
|
||||||
|
"secondary": "#e95353",
|
||||||
|
"secondaryText": "#efefef",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
>
|
>
|
||||||
Example
|
Example
|
||||||
</button>
|
</styled.button>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`Storyshots Button Primary 1`] = `
|
exports[`Storyshots Button Primary 1`] = `
|
||||||
<button
|
<Button
|
||||||
className="sc-bdVaJa hPnBtV"
|
|
||||||
disabled={false}
|
disabled={false}
|
||||||
onClick={[Function]}
|
loading={false}
|
||||||
|
loadingPct={0}
|
||||||
|
onButtonPress={[Function]}
|
||||||
|
overrides={
|
||||||
|
Object {
|
||||||
|
"BaseButton": Object {
|
||||||
|
"component": Object {
|
||||||
|
"$$typeof": Symbol(react.forward_ref),
|
||||||
|
"attrs": Array [],
|
||||||
|
"componentStyle": ComponentStyle {
|
||||||
|
"componentId": "sc-bwzfXH",
|
||||||
|
"isStatic": false,
|
||||||
|
"rules": Array [
|
||||||
|
"
|
||||||
|
/* reset some styles */
|
||||||
|
box-shadow: none;
|
||||||
|
appearance: none;
|
||||||
|
outline: none;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: rgba(0,0,0,0.1);
|
||||||
|
|
||||||
|
/* real styles */
|
||||||
|
position: relative;
|
||||||
|
transition: all 0.05s ease-in-out;
|
||||||
|
padding: 1em 1.4em;
|
||||||
|
font-weight: bold;
|
||||||
|
border: 1px solid rgba(0,0,0,0.1);
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: \\"\\";
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
|
||||||
|
/* transparent by default */
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
transition: background-color 0.05s ease-in-out;
|
||||||
|
|
||||||
|
/* put the overlay behind the text */
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* on hover, raise, brighten and shadow */
|
||||||
|
&:hover {
|
||||||
|
transform: translateY(-1px);
|
||||||
|
box-shadow: 0 1px 2px rgba(0,0,0,0.05);
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
background-color: rgba(255, 255, 255, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* on click, lower and darken */
|
||||||
|
&:active {
|
||||||
|
outline: none;
|
||||||
|
box-shadow: none;
|
||||||
|
border-color: rgba(0,0,0,0.2);
|
||||||
|
|
||||||
|
transform: translateY(0);
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
background-color: rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
",
|
||||||
|
"
|
||||||
|
background-color: ",
|
||||||
|
[Function],
|
||||||
|
";
|
||||||
|
color: ",
|
||||||
|
[Function],
|
||||||
|
";
|
||||||
|
",
|
||||||
|
],
|
||||||
|
},
|
||||||
|
"defaultProps": Object {
|
||||||
|
"theme": Object {
|
||||||
|
"actions": Object {
|
||||||
|
"primary": "#46b646",
|
||||||
|
"primaryText": "#efefef",
|
||||||
|
"secondary": "#e95353",
|
||||||
|
"secondaryText": "#efefef",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"displayName": "Styled(styled.button)",
|
||||||
|
"foldedComponentIds": Array [
|
||||||
|
"sc-bdVaJa",
|
||||||
|
],
|
||||||
|
"render": [Function],
|
||||||
|
"styledComponentId": "sc-bwzfXH",
|
||||||
|
"target": "button",
|
||||||
|
"toString": [Function],
|
||||||
|
"warnTooManyClasses": [Function],
|
||||||
|
"withComponent": [Function],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
primary={false}
|
||||||
|
secondary={false}
|
||||||
>
|
>
|
||||||
Example
|
Example
|
||||||
</button>
|
</Button>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`Storyshots Button Secondary 1`] = `
|
exports[`Storyshots Button Secondary 1`] = `
|
||||||
<button
|
<Button
|
||||||
className="sc-bdVaJa hPnBtV"
|
|
||||||
disabled={false}
|
disabled={false}
|
||||||
onClick={[Function]}
|
loading={false}
|
||||||
|
loadingPct={0}
|
||||||
|
onButtonPress={[Function]}
|
||||||
|
overrides={
|
||||||
|
Object {
|
||||||
|
"BaseButton": Object {
|
||||||
|
"component": Object {
|
||||||
|
"$$typeof": Symbol(react.forward_ref),
|
||||||
|
"attrs": Array [],
|
||||||
|
"componentStyle": ComponentStyle {
|
||||||
|
"componentId": "sc-htpNat",
|
||||||
|
"isStatic": false,
|
||||||
|
"rules": Array [
|
||||||
|
"
|
||||||
|
/* reset some styles */
|
||||||
|
box-shadow: none;
|
||||||
|
appearance: none;
|
||||||
|
outline: none;
|
||||||
|
cursor: pointer;
|
||||||
|
background-color: rgba(0,0,0,0.1);
|
||||||
|
|
||||||
|
/* real styles */
|
||||||
|
position: relative;
|
||||||
|
transition: all 0.05s ease-in-out;
|
||||||
|
padding: 1em 1.4em;
|
||||||
|
font-weight: bold;
|
||||||
|
border: 1px solid rgba(0,0,0,0.1);
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: \\"\\";
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
|
||||||
|
/* transparent by default */
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
transition: background-color 0.05s ease-in-out;
|
||||||
|
|
||||||
|
/* put the overlay behind the text */
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* on hover, raise, brighten and shadow */
|
||||||
|
&:hover {
|
||||||
|
transform: translateY(-1px);
|
||||||
|
box-shadow: 0 1px 2px rgba(0,0,0,0.05);
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
background-color: rgba(255, 255, 255, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* on click, lower and darken */
|
||||||
|
&:active {
|
||||||
|
outline: none;
|
||||||
|
box-shadow: none;
|
||||||
|
border-color: rgba(0,0,0,0.2);
|
||||||
|
|
||||||
|
transform: translateY(0);
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
background-color: rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
",
|
||||||
|
"
|
||||||
|
background-color: ",
|
||||||
|
[Function],
|
||||||
|
";
|
||||||
|
color: ",
|
||||||
|
[Function],
|
||||||
|
";
|
||||||
|
",
|
||||||
|
],
|
||||||
|
},
|
||||||
|
"defaultProps": Object {
|
||||||
|
"theme": Object {
|
||||||
|
"actions": Object {
|
||||||
|
"primary": "#46b646",
|
||||||
|
"primaryText": "#efefef",
|
||||||
|
"secondary": "#e95353",
|
||||||
|
"secondaryText": "#efefef",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"displayName": "Styled(styled.button)",
|
||||||
|
"foldedComponentIds": Array [
|
||||||
|
"sc-bdVaJa",
|
||||||
|
],
|
||||||
|
"render": [Function],
|
||||||
|
"styledComponentId": "sc-htpNat",
|
||||||
|
"target": "button",
|
||||||
|
"toString": [Function],
|
||||||
|
"warnTooManyClasses": [Function],
|
||||||
|
"withComponent": [Function],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
primary={false}
|
||||||
|
secondary={false}
|
||||||
>
|
>
|
||||||
Example
|
Example
|
||||||
</button>
|
</Button>
|
||||||
`;
|
`;
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,12 @@
|
||||||
|
/* jest-env jsdom */
|
||||||
import * as path from 'path'
|
import * as path from 'path'
|
||||||
import initStoryshots from '@storybook/addon-storyshots'
|
import initStoryshots from '@storybook/addon-storyshots'
|
||||||
|
import { shallow } from 'enzyme'
|
||||||
// import Adapter from 'enzyme-adapter-react-16'
|
// import Adapter from 'enzyme-adapter-react-16'
|
||||||
|
|
||||||
// enzyme.configure({ adapter: new Adapter() })
|
// configure({ adapter: new Adapter() })
|
||||||
|
|
||||||
initStoryshots({
|
initStoryshots({
|
||||||
|
renderer: shallow,
|
||||||
configPath: path.resolve(__dirname, '../../.storybook')
|
configPath: path.resolve(__dirname, '../../.storybook')
|
||||||
})
|
})
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue