-
-
Notifications
You must be signed in to change notification settings - Fork 138
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
for easier diffing
- Loading branch information
Showing
42 changed files
with
330 additions
and
272 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,313 @@ | ||
exports[`fixtures should add display names 1`] = ` | ||
"const Test = styled.div.withConfig({ | ||
displayName: \'Test\' | ||
})\`width:100%;\`; | ||
const Test2 = styled(\'div\').withConfig({ | ||
displayName: \'Test2\' | ||
})\`\`; | ||
const Test3 = true ? styled.div.withConfig({ | ||
displayName: \'Test3\' | ||
})\`\` : styled.div.withConfig({ | ||
displayName: \'Test3\' | ||
})\`\`; | ||
const styles = { One: styled.div.withConfig({ | ||
displayName: \'One\' | ||
})\`\` }; | ||
let Component; | ||
Component = styled.div.withConfig({ | ||
displayName: \'Component\' | ||
})\`\`; | ||
const WrappedComponent = styled(Inner).withConfig({ | ||
displayName: \'WrappedComponent\' | ||
})\`\`;" | ||
`; | ||
exports[`fixtures should add identifier 1`] = ` | ||
"const Test = styled.div.withConfig({ | ||
componentId: \"wyb2qx-0\" | ||
})\`width:100%;\`; | ||
const Test2 = true ? styled.div.withConfig({ | ||
componentId: \"wyb2qx-1\" | ||
})\`\` : styled.div.withConfig({ | ||
componentId: \"wyb2qx-2\" | ||
})\`\`; | ||
const styles = { One: styled.div.withConfig({ | ||
componentId: \"wyb2qx-3\" | ||
})\`\` }; | ||
let Component; | ||
Component = styled.div.withConfig({ | ||
componentId: \"wyb2qx-4\" | ||
})\`\`; | ||
const WrappedComponent = styled(Inner).withConfig({ | ||
componentId: \"wyb2qx-5\" | ||
})\`\`;" | ||
`; | ||
exports[`fixtures should add identifier and display name 1`] = ` | ||
"const Test = styled.div.withConfig({ | ||
displayName: \"Test\", | ||
componentId: \"s1obzuja-0\" | ||
})\`width:100%;\`; | ||
const Test2 = true ? styled.div.withConfig({ | ||
displayName: \"Test2\", | ||
componentId: \"s1obzuja-1\" | ||
})\`\` : styled.div.withConfig({ | ||
displayName: \"Test2\", | ||
componentId: \"s1obzuja-2\" | ||
})\`\`; | ||
const styles = { One: styled.div.withConfig({ | ||
displayName: \"One\", | ||
componentId: \"s1obzuja-3\" | ||
})\`\` }; | ||
let Component; | ||
Component = styled.div.withConfig({ | ||
displayName: \"Component\", | ||
componentId: \"s1obzuja-4\" | ||
})\`\`; | ||
const WrappedComponent = styled(Inner).withConfig({ | ||
displayName: \"WrappedComponent\", | ||
componentId: \"s1obzuja-5\" | ||
})\`\`;" | ||
`; | ||
exports[`fixtures should allow chains of member calls 1`] = ` | ||
"const WithAttrs = styled.div.attrs({ some: \'value\' }).withConfig({ | ||
displayName: \'WithAttrs\' | ||
})\`\`; | ||
const WithAttrsWrapped = styled(Inner).attrs({ some: \'value\' }).withConfig({ | ||
displayName: \'WithAttrsWrapped\' | ||
})\`\`;" | ||
`; | ||
exports[`fixtures should minify css in helpers 1`] = ` | ||
"import { css, keyframes } from \'styled-components\'; | ||
const key = keyframes\`to{transform:rotate(360deg);}\`; | ||
const color = css\`color:\${theColor};\`;" | ||
`; | ||
exports[`fixtures should minify css to use with transpilation 1`] = ` | ||
"\'use strict\'; | ||
var _templateObject = _taggedTemplateLiteral([\'width:100%;\'], [\'width:100%;\']), | ||
_templateObject2 = _taggedTemplateLiteral([\'content:\" \', \' \";\'], [\'content:\" \', \' \";\']), | ||
_templateObject3 = _taggedTemplateLiteral([\'content:\" \', \' \";color:red;\'], [\'content:\" \', \' \";color:red;\']), | ||
_templateObject4 = _taggedTemplateLiteral([\'color:red;\'], [\'color:red;\']), | ||
_templateObject5 = _taggedTemplateLiteral([\'&:hover{color:blue;}\'], [\'&:hover{color:blue;}\']); | ||
var _styledComponents = require(\'styled-components\'); | ||
var _styledComponents2 = _interopRequireDefault(_styledComponents); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); } | ||
var Simple = _styledComponents2.default.div(_templateObject); | ||
var Interpolation = _styledComponents2.default.div(_templateObject2, function (props) { | ||
return props.text; | ||
}); | ||
var SpecialCharacters = _styledComponents2.default.div(_templateObject3, function (props) { | ||
return props.text; | ||
}); | ||
var Comment = _styledComponents2.default.div(_templateObject4); | ||
var Parens = _styledComponents2.default.div(_templateObject5);" | ||
`; | ||
exports[`fixtures should minify css to use without transpilation 1`] = ` | ||
"import styled from \'styled-components\'; | ||
const Simple = styled.div\`width:100%;\`; | ||
const Interpolation = styled.div\`content:\"https://test.com/\${props => props.endpoint}\";\`; | ||
const SpecialCharacters = styled.div\`content:\" \${props => props.text} \";color:red;\`; | ||
const Comment = styled.div\`width:100%;color:red;\`; | ||
const Parens = styled.div\`&:hover{color:blue;}color:red;\`; | ||
const UrlComments = styled.div\`color:red;background:red;border:1px solid green;\`;" | ||
`; | ||
exports[`fixtures should not preprocess import 1`] = ` | ||
"import styled from \'styled-components\'; | ||
require(\'styled-components\');" | ||
`; | ||
exports[`fixtures should not use private api if not required 1`] = ` | ||
"import styled from \'styled-components\'; | ||
const Test = styled.div\`width:100%;\`;" | ||
`; | ||
exports[`fixtures should preprocess css 1`] = ` | ||
"const Simple = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__Simple\" | ||
})([[\"{width:100%;}\"]]); | ||
const Nested = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__Nested\" | ||
})([[\"{width:100%;}\"], [\":hover{color:papayawhip;}\"], [\" > div{background:white;}\"]]); | ||
const Interpolations = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__Interpolations\" | ||
})([[\"{width:\", props => props.width, \";}\"]]); | ||
const NestedAndInterpolations = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__NestedAndInterpolations\" | ||
})([[\"{width:\", props => props.width, \";}\"], [\":hover{color:\", props => props.color, \";}\"]]); | ||
const SelectorInterpolation = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__SelectorInterpolation\" | ||
})([[\"{width:\", props => props.width, \";}\"], [\" \", props => props.selector, \"{color:papayawhip;}\"]]); | ||
const RulesetInterpolationA = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__RulesetInterpolationA\" | ||
})([[\"{width:\", props => props.width, \";\", props => props.ruleset, \";}\"], [\":hover{color:papayawhip;}\"]]); | ||
const RulesetInterpolationB = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__RulesetInterpolationB\" | ||
})([[\"{\", props => props.ruleset, \";width:\", props => props.width, \";}\"], [\":hover{color:papayawhip;}\"]]); | ||
const Prefixes = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__Prefixes\" | ||
})([[\"{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\"]]); | ||
const DoubleInterpolation = styled.div.withConfig({ | ||
displayName: \"14-preprocess-css__DoubleInterpolation\" | ||
})([[\"{margin:\", props => props.vert, \" \", props => props.hori, \";}\"]]);" | ||
`; | ||
exports[`fixtures should preprocess import 1`] = ` | ||
"import styled from \'styled-components/no-parser\'; | ||
require(\'styled-components/no-parser\');" | ||
`; | ||
exports[`fixtures should preprocess inject global 1`] = `"injectGlobal([[\"\", glob, \"\\n/*! preserve comment */html,body{margin:100000px;padding:\", test, \";}@media (max-width:999px){html,body{margin:0;}}.root{width:100%;}\"]]);"`; | ||
exports[`fixtures should preprocess keyframes 1`] = `"const Animation = keyframes([[\"@-webkit-keyframes \"], [\"{0%{opacity:0;}100%{opacity:1;}}@keyframes \"], [\"{0%{opacity:0;}100%{opacity:1;}}\"]]);"`; | ||
exports[`fixtures should track the imported variable 1`] = ` | ||
"import s from \"styled-components\"; | ||
const Test = s.div.withConfig({ | ||
displayName: \"Test\", | ||
componentId: \"s1p7rnsm-0\" | ||
})\`width:100%;\`; | ||
const Test2 = true ? s.div.withConfig({ | ||
displayName: \"Test2\", | ||
componentId: \"s1p7rnsm-1\" | ||
})\`\` : s.div.withConfig({ | ||
displayName: \"Test2\", | ||
componentId: \"s1p7rnsm-2\" | ||
})\`\`; | ||
const styles = { One: s.div.withConfig({ | ||
displayName: \"One\", | ||
componentId: \"s1p7rnsm-3\" | ||
})\`\` }; | ||
let Component; | ||
Component = s.div.withConfig({ | ||
displayName: \"Component\", | ||
componentId: \"s1p7rnsm-4\" | ||
})\`\`; | ||
const WrappedComponent = s(Inner).withConfig({ | ||
displayName: \"WrappedComponent\", | ||
componentId: \"s1p7rnsm-5\" | ||
})\`\`;" | ||
`; | ||
exports[`fixtures should transpile require default 1`] = ` | ||
"const styled_default = require(\"styled-components/no-parser\"); | ||
const TestNormal = styled.div.withConfig({ | ||
displayName: \"19-transpile-require-default__TestNormal\", | ||
componentId: \"s1hlt51i-0\" | ||
})([[\"{width:100%;}\"]]); | ||
const Test = styled_default.default.div.withConfig({ | ||
displayName: \"19-transpile-require-default__Test\", | ||
componentId: \"s1hlt51i-1\" | ||
})([[\"{width:100%;}\"]]); | ||
const TestCallExpression = styled_default.default(Test).withConfig({ | ||
displayName: \"19-transpile-require-default__TestCallExpression\", | ||
componentId: \"s1hlt51i-2\" | ||
})([[\"{height:20px;}\"]]);" | ||
`; | ||
exports[`fixtures should transpile template literals with config 1`] = ` | ||
"\'use strict\'; | ||
var _styledComponents = require(\'styled-components\'); | ||
var _styledComponents2 = _interopRequireDefault(_styledComponents); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
var Named = _styledComponents2.default.div.withConfig({ | ||
displayName: \'11-transpile-template-literals-with-config__Named\' | ||
})([\'\\n width: 100%;\\n\']); | ||
var NamedWithInterpolation = _styledComponents2.default.div.withConfig({ | ||
displayName: \'11-transpile-template-literals-with-config__NamedWithInterpolation\' | ||
})([\'\\n color: \', \';\\n\'], function (color) { | ||
return props.color; | ||
}); | ||
var Wrapped = (0, _styledComponents2.default)(Inner).withConfig({ | ||
displayName: \'11-transpile-template-literals-with-config__Wrapped\' | ||
})([\'color: red;\']);" | ||
`; | ||
exports[`fixtures should transpile template literals without config 1`] = ` | ||
"\'use strict\'; | ||
var _styledComponents = require(\'styled-components\'); | ||
var _styledComponents2 = _interopRequireDefault(_styledComponents); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
var Named = _styledComponents2.default.div([\'\\n width: 100%;\\n\']); | ||
var NamedWithInterpolation = _styledComponents2.default.div([\'\\n color: \', \';\\n\'], function (color) { | ||
return props.color; | ||
}); | ||
var Wrapped = (0, _styledComponents2.default)(Inner)([\'color: red;\']);" | ||
`; | ||
exports[`fixtures should use file name 1`] = ` | ||
"import styled from \"styled-components\"; | ||
const Test = styled.div.withConfig({ | ||
displayName: \"05-use-file-name__Test\", | ||
componentId: \"evunba-0\" | ||
})\`color:red;\`; | ||
const before = styled.div.withConfig({ | ||
displayName: \"05-use-file-name__before\", | ||
componentId: \"evunba-1\" | ||
})\`color:blue;\`; | ||
styled.div.withConfig({ | ||
displayName: \"05-use-file-name\", | ||
componentId: \"evunba-2\" | ||
})\`\`; | ||
export default styled.button.withConfig({ | ||
displayName: \"05-use-file-name\", | ||
componentId: \"evunba-3\" | ||
})\`\`;" | ||
`; | ||
exports[`fixtures should work with hoisted default as import 1`] = ` | ||
"const Test = s.div.withConfig({ | ||
displayName: \'06-work-with-hoisted-default-as-import__Test\', | ||
componentId: \'tcn4fb-0\' | ||
})\`width:100%;\`; | ||
import { default as s, css } from \'styled-components\';" | ||
`; |
This file was deleted.
Oops, something went wrong.
File renamed without changes.
This file was deleted.
Oops, something went wrong.
File renamed without changes.
This file was deleted.
Oops, something went wrong.
File renamed without changes.
Oops, something went wrong.