styled-components 2.1.1 → 2.2.1

package/lib/test/basic.test.js

@@ -1,267 +0,0 @@
-'use strict';
-
-var _templateObject = _taggedTemplateLiteralLoose([''], ['']),
-    _templateObject2 = _taggedTemplateLiteralLoose(['\n      color: blue;\n    '], ['\n      color: blue;\n    ']),
-    _templateObject3 = _taggedTemplateLiteralLoose(['color: red;'], ['color: red;']),
-    _templateObject4 = _taggedTemplateLiteralLoose(['color: blue;'], ['color: blue;']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _enzyme = require('enzyme');
-
-var _utils = require('./utils');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { strings.raw = raw; return strings; }
-
-var styled = void 0;
-
-describe('basic', function () {
-  /**
-   * Make sure the setup is the same for every test
-   */
-  beforeEach(function () {
-    styled = (0, _utils.resetStyled)();
-  });
-
-  it('should not throw an error when called', function () {
-    styled.div(_templateObject);
-  });
-
-  it('should throw a meaningful error when called with null', function () {
-    var invalidComps = [undefined, null, 123, []];
-    invalidComps.forEach(function (comp) {
-      expect(function () {
-        // $FlowInvalidInputTest
-        var Comp = styled(comp);
-        (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-        // $FlowInvalidInputTest
-      }).toThrow('Cannot create styled-component for component: ' + comp);
-    });
-  });
-
-  it('should not inject anything by default', function () {
-    styled.div(_templateObject);
-    (0, _utils.expectCSSMatches)('');
-  });
-
-  it('should inject component class when rendered even if no styles are passed', function () {
-    var Comp = styled.div(_templateObject);
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _utils.expectCSSMatches)('.sc-a {}');
-  });
-
-  it('should inject styles', function () {
-    var Comp = styled.div(_templateObject2);
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _utils.expectCSSMatches)('.sc-a { } .b { color: blue; }');
-  });
-
-  it('should inject only once for a styled component, no matter how often it\'s mounted', function () {
-    var Comp = styled.div(_templateObject2);
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _utils.expectCSSMatches)('.sc-a {} .b { color: blue; }');
-  });
-
-  it('Should have the correct styled(component) displayName', function () {
-    var CompWithoutName = function CompWithoutName() {
-      return function () {
-        return _react2.default.createElement('div', null);
-      };
-    };
-
-    var StyledTag = styled.div(_templateObject);
-    expect(StyledTag.displayName).toBe('styled.div');
-
-    var CompWithName = function CompWithName() {
-      return _react2.default.createElement('div', null);
-    };
-    CompWithName.displayName = null;
-    var StyledCompWithName = styled(CompWithName)(_templateObject);
-    expect(StyledCompWithName.displayName).toBe('Styled(CompWithName)');
-
-    var CompWithDisplayName = CompWithoutName();
-    CompWithDisplayName.displayName = 'displayName';
-    var StyledCompWithDisplayName = styled(CompWithDisplayName)(_templateObject);
-    expect(StyledCompWithDisplayName.displayName).toBe('Styled(displayName)');
-
-    var CompWithBoth = function CompWithBoth() {
-      return _react2.default.createElement('div', null);
-    };
-    CompWithBoth.displayName = 'displayName';
-    var StyledCompWithBoth = styled(CompWithBoth)(_templateObject);
-    expect(StyledCompWithBoth.displayName).toBe('Styled(displayName)');
-
-    var CompWithNothing = CompWithoutName();
-    CompWithNothing.displayName = null;
-    var StyledCompWithNothing = styled(CompWithNothing)(_templateObject);
-    expect(StyledCompWithNothing.displayName).toBe('Styled(Component)');
-  });
-
-  describe('jsdom tests', function () {
-    it('should pass the ref to the component', function () {
-      var Comp = styled.div(_templateObject);
-
-      var Wrapper = function (_Component) {
-        _inherits(Wrapper, _Component);
-
-        function Wrapper() {
-          var _temp, _this, _ret;
-
-          _classCallCheck(this, Wrapper);
-
-          for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
-            args[_key] = arguments[_key];
-          }
-
-          return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.innerRef = function (comp) {
-            _this.testRef = comp;
-          }, _temp), _possibleConstructorReturn(_this, _ret);
-        }
-
-        Wrapper.prototype.render = function render() {
-          return _react2.default.createElement(Comp, { innerRef: this.innerRef });
-        };
-
-        return Wrapper;
-      }(_react.Component);
-
-      var wrapper = (0, _enzyme.mount)(_react2.default.createElement(Wrapper, null));
-      var component = wrapper.find(Comp).first();
-
-      // $FlowFixMe
-      expect(wrapper.node.testRef).toBe(component.getDOMNode());
-      expect(component.find('div').prop('innerRef')).toBeFalsy();
-    });
-
-    var InnerComponent = function (_Component2) {
-      _inherits(InnerComponent, _Component2);
-
-      function InnerComponent() {
-        _classCallCheck(this, InnerComponent);
-
-        return _possibleConstructorReturn(this, _Component2.apply(this, arguments));
-      }
-
-      InnerComponent.prototype.render = function render() {
-        return null;
-      };
-
-      return InnerComponent;
-    }(_react.Component);
-
-    it('should not leak the innerRef prop to the wrapped child', function () {
-      var OuterComponent = styled(InnerComponent)(_templateObject);
-
-      var Wrapper = function (_Component3) {
-        _inherits(Wrapper, _Component3);
-
-        function Wrapper() {
-          _classCallCheck(this, Wrapper);
-
-          return _possibleConstructorReturn(this, _Component3.apply(this, arguments));
-        }
-
-        Wrapper.prototype.render = function render() {
-          var _this4 = this;
-
-          return _react2.default.createElement(OuterComponent, { innerRef: function innerRef(comp) {
-              _this4.testRef = comp;
-            } });
-        };
-
-        return Wrapper;
-      }(_react.Component);
-
-      var wrapper = (0, _enzyme.mount)(_react2.default.createElement(Wrapper, null));
-      var innerComponent = wrapper.find(InnerComponent).first();
-
-      // $FlowFixMe
-      expect(wrapper.node.testRef).toBe(innerComponent.node);
-      expect(innerComponent.prop('innerRef')).toBeFalsy();
-    });
-
-    it('should pass the full className to the wrapped child', function () {
-      var OuterComponent = styled(InnerComponent)(_templateObject);
-
-      var Wrapper = function (_Component4) {
-        _inherits(Wrapper, _Component4);
-
-        function Wrapper() {
-          _classCallCheck(this, Wrapper);
-
-          return _possibleConstructorReturn(this, _Component4.apply(this, arguments));
-        }
-
-        Wrapper.prototype.render = function render() {
-          return _react2.default.createElement(OuterComponent, { className: 'test' });
-        };
-
-        return Wrapper;
-      }(_react.Component);
-
-      var wrapper = (0, _enzyme.mount)(_react2.default.createElement(Wrapper, null));
-      expect(wrapper.find(InnerComponent).prop('className')).toBe('test sc-a b');
-    });
-
-    it('should pass the innerRef to the wrapped styled component', function () {
-      var InnerComponent = styled.div(_templateObject);
-      var OuterComponent = styled(InnerComponent)(_templateObject);
-
-      var Wrapper = function (_Component5) {
-        _inherits(Wrapper, _Component5);
-
-        function Wrapper() {
-          var _temp2, _this6, _ret2;
-
-          _classCallCheck(this, Wrapper);
-
-          for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-            args[_key2] = arguments[_key2];
-          }
-
-          return _ret2 = (_temp2 = (_this6 = _possibleConstructorReturn(this, _Component5.call.apply(_Component5, [this].concat(args))), _this6), _this6.innerRef = function (comp) {
-            _this6.testRef = comp;
-          }, _temp2), _possibleConstructorReturn(_this6, _ret2);
-        }
-
-        Wrapper.prototype.render = function render() {
-          return _react2.default.createElement(OuterComponent, { innerRef: this.innerRef });
-        };
-
-        return Wrapper;
-      }(_react.Component);
-
-      var wrapper = (0, _enzyme.mount)(_react2.default.createElement(Wrapper, null));
-      var innerComponent = wrapper.find(InnerComponent).first();
-      var outerComponent = wrapper.find(OuterComponent).first();
-
-      // $FlowFixMe
-      expect(wrapper.node.testRef).toBe(innerComponent.getDOMNode());
-
-      // $FlowFixMe
-      expect(innerComponent.prop('innerRef')).toBe(wrapper.node.innerRef);
-    });
-
-    it('should respect the order of StyledComponent creation for CSS ordering', function () {
-      var FirstComponent = styled.div(_templateObject3);
-      var SecondComponent = styled.div(_templateObject4);
-
-      // NOTE: We're mounting second before first and check if we're breaking their order
-      (0, _enzyme.shallow)(_react2.default.createElement(SecondComponent, null));
-      (0, _enzyme.shallow)(_react2.default.createElement(FirstComponent, null));
-
-      (0, _utils.expectCSSMatches)('.sc-a {} .d { color: red; } .sc-b {} .c { color: blue; }');
-    });
-  });
-});

package/lib/test/css.test.js

@@ -1,43 +0,0 @@
-'use strict';
-
-var _templateObject = _taggedTemplateLiteralLoose(['\n      transition: opacity 0.3s;\n    '], ['\n      transition: opacity 0.3s;\n    ']),
-    _templateObject2 = _taggedTemplateLiteralLoose(['\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n    '], ['\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n    ']),
-    _templateObject3 = _taggedTemplateLiteralLoose(['\n      --custom-prop: some-val;\n    '], ['\n      --custom-prop: some-val;\n    ']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _enzyme = require('enzyme');
-
-var _utils = require('./utils');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { strings.raw = raw; return strings; }
-
-var styled = void 0;
-
-describe('css features', function () {
-  beforeEach(function () {
-    styled = (0, _utils.resetStyled)();
-  });
-
-  it('should add vendor prefixes in the right order', function () {
-    var Comp = styled.div(_templateObject);
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _utils.expectCSSMatches)('.sc-a {} .b { -webkit-transition: opacity 0.3s; transition: opacity 0.3s; }');
-  });
-
-  it('should add vendor prefixes for display', function () {
-    var Comp = styled.div(_templateObject2);
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _utils.expectCSSMatches)('\n      .sc-a {}\n      .b {\n        display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;\n      }\n    ');
-  });
-
-  it('should pass through custom properties', function () {
-    var Comp = styled.div(_templateObject3);
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _utils.expectCSSMatches)('.sc-a {} .b { --custom-prop: some-val; }');
-  });
-});

package/lib/test/expanded-api.test.js

@@ -1,90 +0,0 @@
-'use strict';
-
-var _templateObject = _taggedTemplateLiteralLoose([''], ['']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _enzyme = require('enzyme');
-
-var _utils = require('./utils');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { strings.raw = raw; return strings; }
-
-var styled = void 0;
-
-describe('expanded api', function () {
-  /**
-   * Make sure the setup is the same for every test
-   */
-  beforeEach(function () {
-    styled = (0, _utils.resetStyled)();
-  });
-
-  describe('displayName', function () {
-    it('should be auto-generated if none passed', function () {
-      var Comp = styled.div(_templateObject);
-      expect(Comp.displayName).toBe('styled.div');
-    });
-
-    it('should be attached if supplied', function () {
-      var Comp = styled.div.withConfig({ displayName: 'Comp' })(_templateObject);
-      expect(Comp.displayName).toBe('Comp');
-    });
-  });
-
-  describe('componentId', function () {
-    it('should be generated as "sc" + hash', function () {
-      var Comp = styled.div(_templateObject);
-      var Comp2 = styled.div(_templateObject);
-      expect(Comp.styledComponentId).toBe('sc-a');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp, null)).prop('className')).toMatch(/sc-a/);
-      expect(Comp2.styledComponentId).toBe('sc-b');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp2, null)).prop('className')).toMatch(/sc-b/);
-    });
-
-    it('should be generated from displayName + hash', function () {
-      var Comp = styled.div.withConfig({ displayName: 'Comp' })(_templateObject);
-      var Comp2 = styled.div.withConfig({ displayName: 'Comp2' })(_templateObject);
-      expect(Comp.styledComponentId).toBe('Comp-a');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp, null)).prop('className')).toMatch(/Comp-a/);
-      expect(Comp2.styledComponentId).toBe('Comp2-b');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp2, null)).prop('className')).toMatch(/Comp2-b/);
-    });
-
-    it('should be attached if passed in', function () {
-      var Comp = styled.div.withConfig({ componentId: 'LOLOMG' })(_templateObject);
-      var Comp2 = styled.div.withConfig({ componentId: 'OMGLOL' })(_templateObject);
-      expect(Comp.styledComponentId).toBe('LOLOMG');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp, null)).prop('className')).toMatch(/LOLOMG/);
-      expect(Comp2.styledComponentId).toBe('OMGLOL');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp2, null)).prop('className')).toMatch(/OMGLOL/);
-    });
-
-    it('should be combined with displayName if both passed in', function () {
-      var Comp = styled.div.withConfig({ displayName: 'Comp', componentId: 'LOLOMG' })(_templateObject);
-      var Comp2 = styled.div.withConfig({ displayName: 'Comp2', componentId: 'OMGLOL' })(_templateObject);
-      expect(Comp.styledComponentId).toBe('Comp-LOLOMG');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp, null)).prop('className')).toMatch(/Comp-LOLOMG/);
-      expect(Comp2.styledComponentId).toBe('Comp2-OMGLOL');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp2, null)).prop('className')).toMatch(/Comp2-OMGLOL/);
-    });
-  });
-
-  describe('chaining', function () {
-    it('should merge the options strings', function () {
-      var Comp = styled.div.withConfig({ componentId: 'id-1' }).withConfig({ displayName: 'dn-2' })(_templateObject);
-      expect(Comp.displayName).toBe('dn-2');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp, null)).prop('className')).toBe('dn-2-id-1 a');
-    });
-
-    it('should keep the last value passed in when merging', function () {
-      var Comp = styled.div.withConfig({ displayName: 'dn-2', componentId: 'id-3' }).withConfig({ displayName: 'dn-5', componentId: 'id-4' })(_templateObject);
-      expect(Comp.displayName).toBe('dn-5');
-      expect((0, _enzyme.shallow)(_react2.default.createElement(Comp, null)).prop('className')).toBe('dn-5-id-4 a');
-    });
-  });
-});

package/lib/test/extending.test.js

@@ -1,198 +0,0 @@
-'use strict';
-
-var _templateObject = _taggedTemplateLiteralLoose([''], ['']),
-    _templateObject2 = _taggedTemplateLiteralLoose(['color: blue;'], ['color: blue;']),
-    _templateObject3 = _taggedTemplateLiteralLoose(['color: red;'], ['color: red;']),
-    _templateObject4 = _taggedTemplateLiteralLoose(['\n      color: blue;\n      > h1 { font-size: 4rem; }\n    '], ['\n      color: blue;\n      > h1 { font-size: 4rem; }\n    ']),
-    _templateObject5 = _taggedTemplateLiteralLoose(['\n      color: ', ';\n    '], ['\n      color: ', ';\n    ']),
-    _templateObject6 = _taggedTemplateLiteralLoose(['background-color: green;'], ['background-color: green;']),
-    _templateObject7 = _taggedTemplateLiteralLoose(['color: green;'], ['color: green;']),
-    _templateObject8 = _taggedTemplateLiteralLoose(['color:red;'], ['color:red;']),
-    _templateObject9 = _taggedTemplateLiteralLoose(['\n      background-color: red;\n    '], ['\n      background-color: red;\n    ']),
-    _templateObject10 = _taggedTemplateLiteralLoose(['\n      color: blue;\n    '], ['\n      color: blue;\n    ']),
-    _templateObject11 = _taggedTemplateLiteralLoose(['\n      border: 2px solid black;\n    '], ['\n      border: 2px solid black;\n    ']),
-    _templateObject12 = _taggedTemplateLiteralLoose(['\n      border-width: 10;\n    '], ['\n      border-width: 10;\n    ']),
-    _templateObject13 = _taggedTemplateLiteralLoose(['\n      color: red;\n    '], ['\n      color: red;\n    ']),
-    _templateObject14 = _taggedTemplateLiteralLoose(['\n      color: green;\n    '], ['\n      color: green;\n    ']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
-var _enzyme = require('enzyme');
-
-var _utils = require('./utils');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { strings.raw = raw; return strings; }
-
-var styled = void 0;
-
-describe('extending', function () {
-  /**
-   * Make sure the setup is the same for every test
-   */
-  beforeEach(function () {
-    styled = (0, _utils.resetStyled)();
-  });
-
-  it('should generate empty classes with no styles', function () {
-    var Parent = styled.div(_templateObject);
-    var Child = Parent.extend(_templateObject);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('.sc-a {} .sc-b {}');
-  });
-
-  it('should attach styles to both classes if only parent has styles', function () {
-    var Parent = styled.div(_templateObject2);
-    var Child = Parent.extend(_templateObject);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('.sc-a {} .c { color: blue; } .sc-b {} .d { color: blue; }');
-  });
-
-  it('should attach styles to child class if only child has styles', function () {
-    var Parent = styled.div(_templateObject);
-    var Child = Parent.extend(_templateObject2);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('.sc-a {} .sc-b {} .d { color: blue; }');
-  });
-
-  it('should generate a class for the child with the rules of the parent', function () {
-    var Parent = styled.div(_templateObject2);
-    var Child = Parent.extend(_templateObject3);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('.sc-b {} .c { color: blue;color: red; }');
-  });
-
-  it('should generate different classes for both parent and child', function () {
-    var Parent = styled.div(_templateObject2);
-    var Child = Parent.extend(_templateObject3);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('.sc-a {} .c { color: blue; } .sc-b {} .d { color: blue;color: red; }');
-  });
-
-  it('should copy nested rules to the child', function () {
-    var Parent = styled.div(_templateObject4);
-    var Child = Parent.extend(_templateObject3);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('\n      .sc-a {}\n      .c{ color: blue; }\n      .c > h1{ font-size: 4rem; }\n      .sc-b {}\n      .d { color: blue; color: red; }\n      .d > h1 { font-size: 4rem; }\n    ');
-  });
-
-  it('should keep default props from parent', function () {
-    var Parent = styled.div(_templateObject5, function (props) {
-      return props.color;
-    });
-    Parent.defaultProps = {
-      color: 'red'
-    };
-
-    var Child = Parent.extend(_templateObject6);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('\n      .sc-a {} .c { color: red; }\n      .sc-b {} .d { color: red; background-color: green; }\n    ');
-  });
-
-  it('should keep prop types from parent', function () {
-    var Parent = styled.div(_templateObject5, function (props) {
-      return props.color;
-    });
-    Parent.propTypes = {
-      color: _propTypes2.default.string
-    };
-
-    var Child = Parent.extend(_templateObject6);
-
-    expect(Child.propTypes).toEqual(Parent.propTypes);
-  });
-
-  it('should keep custom static member from parent', function () {
-    var Parent = styled.div(_templateObject3);
-
-    Parent.fetchData = function () {
-      return 1;
-    };
-
-    var Child = Parent.extend(_templateObject7);
-
-    expect(Child.fetchData).toBeTruthy();
-    expect(Child.fetchData()).toEqual(1);
-  });
-
-  it('should keep static member in triple inheritance', function () {
-    var GrandParent = styled.div(_templateObject3);
-    GrandParent.fetchData = function () {
-      return 1;
-    };
-
-    var Parent = GrandParent.extend(_templateObject3);
-    var Child = Parent.extend(_templateObject8);
-
-    expect(Child.fetchData).toBeTruthy();
-    expect(Child.fetchData()).toEqual(1);
-  });
-
-  it('should keep styles in >= 3 inheritances', function () {
-    var GrandGrandParent = styled.div(_templateObject9);
-
-    var GrandParent = GrandGrandParent.extend(_templateObject10);
-
-    var Parent = GrandParent.extend(_templateObject11);
-
-    var Child = Parent.extend(_templateObject12);
-
-    (0, _enzyme.shallow)(_react2.default.createElement(GrandGrandParent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(GrandParent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Parent, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Child, null));
-
-    (0, _utils.expectCSSMatches)('\n      .sc-a { }\n      .e { background-color: red; }\n      .sc-b { }\n      .f { background-color: red; color: blue; }\n      .sc-c { }\n      .g { background-color: red; color: blue; border: 2px solid black; }\n      .sc-d { }\n      .h { background-color: red; color: blue; border: 2px solid black; border-width: 10; }\n    ');
-  });
-
-  it('should allow changing component', function () {
-    var Parent = styled.div(_templateObject3);
-    var Child = Parent.withComponent('span');
-
-    expect((0, _enzyme.shallow)(_react2.default.createElement(Child, null)).html()).toEqual('<span class="sc-b c"></span>');
-  });
-
-  it('should allow changing component and extending', function () {
-    var Parent = styled.div(_templateObject13);
-    var Child = Parent.withComponent('span').extend(_templateObject14);
-
-    expect((0, _enzyme.shallow)(_react2.default.createElement(Child, null)).html()).toEqual('<span class="sc-c d"></span>');
-    (0, _utils.expectCSSMatches)('\n      .sc-c {} .d { color: red; color: green; }\n    ');
-  });
-
-  it('should allow changing component and adding attributes', function () {
-    var Parent = styled.button(_templateObject13);
-    var Child = Parent.withComponent('a').extend.attrs({
-      href: '/test'
-    })(_templateObject);
-
-    expect((0, _enzyme.shallow)(_react2.default.createElement(Child, null)).html()).toEqual('<a href="/test" class="sc-c d"></a>');
-  });
-});

package/lib/test/overriding.test.js

@@ -1,35 +0,0 @@
-'use strict';
-
-var _templateObject = _taggedTemplateLiteralLoose(['\n      color: blue;\n      font-weight: light;\n    '], ['\n      color: blue;\n      font-weight: light;\n    ']),
-    _templateObject2 = _taggedTemplateLiteralLoose(['\n      padding: 1rem;\n      > ', ' {\n        font-weight: bold;\n      }\n    '], ['\n      padding: 1rem;\n      > ', ' {\n        font-weight: bold;\n      }\n    ']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _enzyme = require('enzyme');
-
-var _utils = require('./utils');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { strings.raw = raw; return strings; }
-
-var styled = void 0;
-
-describe('extending', function () {
-  /**
-   * Make sure the setup is the same for every test
-   */
-  beforeEach(function () {
-    styled = (0, _utils.resetStyled)();
-  });
-
-  it('should let you use another component in a css rule', function () {
-    var Inner = styled.div(_templateObject);
-    var Outer = styled.div(_templateObject2, Inner);
-    (0, _enzyme.shallow)(_react2.default.createElement(Inner, null));
-    (0, _enzyme.shallow)(_react2.default.createElement(Outer, null));
-    (0, _utils.expectCSSMatches)('\n      .sc-a {}\n      .c { color: blue; font-weight: light; }\n      .sc-b {}\n      .d { padding: 1rem; }\n      .d > .sc-a { font-weight: bold; }\n    ');
-  });
-});

package/lib/test/props.test.js

@@ -1,38 +0,0 @@
-'use strict';
-
-var _templateObject = _taggedTemplateLiteralLoose(['\n      color: ', ';\n    '], ['\n      color: ', ';\n    ']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _enzyme = require('enzyme');
-
-var _utils = require('./utils');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { strings.raw = raw; return strings; }
-
-var styled = void 0;
-
-describe('props', function () {
-  beforeEach(function () {
-    styled = (0, _utils.resetStyled)();
-  });
-
-  it('should execute interpolations and fall back', function () {
-    var Comp = styled.div(_templateObject, function (props) {
-      return props.fg || 'black';
-    });
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, null));
-    (0, _utils.expectCSSMatches)('.sc-a {} .b { color: black; }');
-  });
-  it('should execute interpolations and inject props', function () {
-    var Comp = styled.div(_templateObject, function (props) {
-      return props.fg || 'black';
-    });
-    (0, _enzyme.shallow)(_react2.default.createElement(Comp, { fg: 'red' }));
-    (0, _utils.expectCSSMatches)('.sc-a {} .b { color: red; }');
-  });
-});