Repository URL to install this package:
|
Version:
1.2.11 ▾
|
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
// @flow
const react_1 = __importDefault(require("react"));
const enzyme_1 = require("enzyme");
const utils_1 = require("./utils");
let styled;
describe('css features', () => {
beforeEach(() => {
styled = utils_1.resetStyled();
});
it('should add vendor prefixes in the right order', () => {
const Comp = styled.div `
transition: opacity 0.3s;
`;
enzyme_1.shallow(react_1.default.createElement(Comp, null));
utils_1.expectCSSMatches('.sc-a {} .b { -webkit-transition:opacity 0.3s; transition:opacity 0.3s; }');
});
it('should add vendor prefixes for display', () => {
const Comp = styled.div `
display: flex;
flex-direction: column;
align-items: center;
`;
enzyme_1.shallow(react_1.default.createElement(Comp, null));
utils_1.expectCSSMatches(`
.sc-a {}
.b {
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;
}
`);
});
it('should generate styles for nested media queries', () => {
const Comp = styled.div `
@media (min-width: 10px) {
@media (min-height: 20px) {
color: red;
}
}
`;
enzyme_1.shallow(react_1.default.createElement(Comp, null));
utils_1.expectCSSMatches(`
.sc-a {}
@media (min-width: 10px) {
@media (min-height: 20px) {
.b {
color: red;
}
}
}
`);
});
it('should pass through custom properties', () => {
const Comp = styled.div `
--custom-prop: some-val;
`;
enzyme_1.shallow(react_1.default.createElement(Comp, null));
utils_1.expectCSSMatches('.sc-a {} .b { --custom-prop:some-val; }');
});
});
//# sourceMappingURL=css.test.js.map