test(compiler): do not use `a` as a content selector
As it might trigger false positive in the RegExp from `_makeScopeMatcher` closes #20256
This commit is contained in:
parent
c32f5fd393
commit
9bcd7097d0
|
@ -19,192 +19,203 @@ export function main() {
|
|||
return normalizeCSS(shim.replace(nlRegexp, ''));
|
||||
}
|
||||
|
||||
it('should handle empty string', () => { expect(s('', 'a')).toEqual(''); });
|
||||
it('should handle empty string', () => { expect(s('', 'contenta')).toEqual(''); });
|
||||
|
||||
it('should add an attribute to every rule', () => {
|
||||
const css = 'one {color: red;}two {color: red;}';
|
||||
const expected = 'one[a] {color:red;}two[a] {color:red;}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected = 'one[contenta] {color:red;}two[contenta] {color:red;}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should handle invalid css', () => {
|
||||
const css = 'one {color: red;}garbage';
|
||||
const expected = 'one[a] {color:red;}garbage';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected = 'one[contenta] {color:red;}garbage';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should add an attribute to every selector', () => {
|
||||
const css = 'one, two {color: red;}';
|
||||
const expected = 'one[a], two[a] {color:red;}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected = 'one[contenta], two[contenta] {color:red;}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should support newlines in the selector and content ', () => {
|
||||
const css = 'one, \ntwo {\ncolor: red;}';
|
||||
const expected = 'one[a], two[a] {color:red;}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected = 'one[contenta], two[contenta] {color:red;}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should handle media rules', () => {
|
||||
const css = '@media screen and (max-width:800px, max-height:100%) {div {font-size:50px;}}';
|
||||
const expected =
|
||||
'@media screen and (max-width:800px, max-height:100%) {div[a] {font-size:50px;}}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
'@media screen and (max-width:800px, max-height:100%) {div[contenta] {font-size:50px;}}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should handle page rules', () => {
|
||||
const css = '@page {div {font-size:50px;}}';
|
||||
const expected = '@page {div[a] {font-size:50px;}}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected = '@page {div[contenta] {font-size:50px;}}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should handle document rules', () => {
|
||||
const css = '@document url(http://www.w3.org/) {div {font-size:50px;}}';
|
||||
const expected = '@document url(http://www.w3.org/) {div[a] {font-size:50px;}}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected = '@document url(http://www.w3.org/) {div[contenta] {font-size:50px;}}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should handle media rules with simple rules', () => {
|
||||
const css = '@media screen and (max-width: 800px) {div {font-size: 50px;}} div {}';
|
||||
const expected = '@media screen and (max-width:800px) {div[a] {font-size:50px;}} div[a] {}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected =
|
||||
'@media screen and (max-width:800px) {div[contenta] {font-size:50px;}} div[contenta] {}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
it('should handle support rules', () => {
|
||||
const css = '@supports (display: flex) {section {display: flex;}}';
|
||||
const expected = '@supports (display:flex) {section[a] {display:flex;}}';
|
||||
expect(s(css, 'a')).toEqual(expected);
|
||||
const expected = '@supports (display:flex) {section[contenta] {display:flex;}}';
|
||||
expect(s(css, 'contenta')).toEqual(expected);
|
||||
});
|
||||
|
||||
// Check that the browser supports unprefixed CSS animation
|
||||
it('should handle keyframes rules', () => {
|
||||
const css = '@keyframes foo {0% {transform:translate(-50%) scaleX(0);}}';
|
||||
expect(s(css, 'a')).toEqual(css);
|
||||
expect(s(css, 'contenta')).toEqual(css);
|
||||
});
|
||||
|
||||
it('should handle -webkit-keyframes rules', () => {
|
||||
const css = '@-webkit-keyframes foo {0% {-webkit-transform:translate(-50%) scaleX(0);}}';
|
||||
expect(s(css, 'a')).toEqual(css);
|
||||
expect(s(css, 'contenta')).toEqual(css);
|
||||
});
|
||||
|
||||
it('should handle complicated selectors', () => {
|
||||
expect(s('one::before {}', 'a')).toEqual('one[a]::before {}');
|
||||
expect(s('one two {}', 'a')).toEqual('one[a] two[a] {}');
|
||||
expect(s('one > two {}', 'a')).toEqual('one[a] > two[a] {}');
|
||||
expect(s('one + two {}', 'a')).toEqual('one[a] + two[a] {}');
|
||||
expect(s('one ~ two {}', 'a')).toEqual('one[a] ~ two[a] {}');
|
||||
const res = s('.one.two > three {}', 'a'); // IE swap classes
|
||||
expect(res == '.one.two[a] > three[a] {}' || res == '.two.one[a] > three[a] {}')
|
||||
expect(s('one::before {}', 'contenta')).toEqual('one[contenta]::before {}');
|
||||
expect(s('one two {}', 'contenta')).toEqual('one[contenta] two[contenta] {}');
|
||||
expect(s('one > two {}', 'contenta')).toEqual('one[contenta] > two[contenta] {}');
|
||||
expect(s('one + two {}', 'contenta')).toEqual('one[contenta] + two[contenta] {}');
|
||||
expect(s('one ~ two {}', 'contenta')).toEqual('one[contenta] ~ two[contenta] {}');
|
||||
const res = s('.one.two > three {}', 'contenta'); // IE swap classes
|
||||
expect(
|
||||
res == '.one.two[contenta] > three[contenta] {}' ||
|
||||
res == '.two.one[contenta] > three[contenta] {}')
|
||||
.toEqual(true);
|
||||
expect(s('one[attr="value"] {}', 'a')).toEqual('one[attr="value"][a] {}');
|
||||
expect(s('one[attr=value] {}', 'a')).toEqual('one[attr="value"][a] {}');
|
||||
expect(s('one[attr^="value"] {}', 'a')).toEqual('one[attr^="value"][a] {}');
|
||||
expect(s('one[attr$="value"] {}', 'a')).toEqual('one[attr$="value"][a] {}');
|
||||
expect(s('one[attr*="value"] {}', 'a')).toEqual('one[attr*="value"][a] {}');
|
||||
expect(s('one[attr|="value"] {}', 'a')).toEqual('one[attr|="value"][a] {}');
|
||||
expect(s('one[attr~="value"] {}', 'a')).toEqual('one[attr~="value"][a] {}');
|
||||
expect(s('one[attr="va lue"] {}', 'a')).toEqual('one[attr="va lue"][a] {}');
|
||||
expect(s('one[attr] {}', 'a')).toEqual('one[attr][a] {}');
|
||||
expect(s('[is="one"] {}', 'a')).toEqual('[is="one"][a] {}');
|
||||
expect(s('one[attr="value"] {}', 'contenta')).toEqual('one[attr="value"][contenta] {}');
|
||||
expect(s('one[attr=value] {}', 'contenta')).toEqual('one[attr="value"][contenta] {}');
|
||||
expect(s('one[attr^="value"] {}', 'contenta')).toEqual('one[attr^="value"][contenta] {}');
|
||||
expect(s('one[attr$="value"] {}', 'contenta')).toEqual('one[attr$="value"][contenta] {}');
|
||||
expect(s('one[attr*="value"] {}', 'contenta')).toEqual('one[attr*="value"][contenta] {}');
|
||||
expect(s('one[attr|="value"] {}', 'contenta')).toEqual('one[attr|="value"][contenta] {}');
|
||||
expect(s('one[attr~="value"] {}', 'contenta')).toEqual('one[attr~="value"][contenta] {}');
|
||||
expect(s('one[attr="va lue"] {}', 'contenta')).toEqual('one[attr="va lue"][contenta] {}');
|
||||
expect(s('one[attr] {}', 'contenta')).toEqual('one[attr][contenta] {}');
|
||||
expect(s('[is="one"] {}', 'contenta')).toEqual('[is="one"][contenta] {}');
|
||||
});
|
||||
|
||||
describe((':host'), () => {
|
||||
it('should handle no context',
|
||||
() => { expect(s(':host {}', 'a', 'a-host')).toEqual('[a-host] {}'); });
|
||||
() => { expect(s(':host {}', 'contenta', 'a-host')).toEqual('[a-host] {}'); });
|
||||
|
||||
it('should handle tag selector',
|
||||
() => { expect(s(':host(ul) {}', 'a', 'a-host')).toEqual('ul[a-host] {}'); });
|
||||
() => { expect(s(':host(ul) {}', 'contenta', 'a-host')).toEqual('ul[a-host] {}'); });
|
||||
|
||||
it('should handle class selector',
|
||||
() => { expect(s(':host(.x) {}', 'a', 'a-host')).toEqual('.x[a-host] {}'); });
|
||||
() => { expect(s(':host(.x) {}', 'contenta', 'a-host')).toEqual('.x[a-host] {}'); });
|
||||
|
||||
it('should handle attribute selector', () => {
|
||||
expect(s(':host([a="b"]) {}', 'a', 'a-host')).toEqual('[a="b"][a-host] {}');
|
||||
expect(s(':host([a=b]) {}', 'a', 'a-host')).toEqual('[a="b"][a-host] {}');
|
||||
expect(s(':host([a="b"]) {}', 'contenta', 'a-host')).toEqual('[a="b"][a-host] {}');
|
||||
expect(s(':host([a=b]) {}', 'contenta', 'a-host')).toEqual('[a="b"][a-host] {}');
|
||||
});
|
||||
|
||||
it('should handle multiple tag selectors', () => {
|
||||
expect(s(':host(ul,li) {}', 'a', 'a-host')).toEqual('ul[a-host], li[a-host] {}');
|
||||
expect(s(':host(ul,li) > .z {}', 'a', 'a-host'))
|
||||
.toEqual('ul[a-host] > .z[a], li[a-host] > .z[a] {}');
|
||||
expect(s(':host(ul,li) {}', 'contenta', 'a-host')).toEqual('ul[a-host], li[a-host] {}');
|
||||
expect(s(':host(ul,li) > .z {}', 'contenta', 'a-host'))
|
||||
.toEqual('ul[a-host] > .z[contenta], li[a-host] > .z[contenta] {}');
|
||||
});
|
||||
|
||||
it('should handle multiple class selectors', () => {
|
||||
expect(s(':host(.x,.y) {}', 'a', 'a-host')).toEqual('.x[a-host], .y[a-host] {}');
|
||||
expect(s(':host(.x,.y) > .z {}', 'a', 'a-host'))
|
||||
.toEqual('.x[a-host] > .z[a], .y[a-host] > .z[a] {}');
|
||||
expect(s(':host(.x,.y) {}', 'contenta', 'a-host')).toEqual('.x[a-host], .y[a-host] {}');
|
||||
expect(s(':host(.x,.y) > .z {}', 'contenta', 'a-host'))
|
||||
.toEqual('.x[a-host] > .z[contenta], .y[a-host] > .z[contenta] {}');
|
||||
});
|
||||
|
||||
it('should handle multiple attribute selectors', () => {
|
||||
expect(s(':host([a="b"],[c=d]) {}', 'a', 'a-host'))
|
||||
expect(s(':host([a="b"],[c=d]) {}', 'contenta', 'a-host'))
|
||||
.toEqual('[a="b"][a-host], [c="d"][a-host] {}');
|
||||
});
|
||||
|
||||
it('should handle pseudo selectors', () => {
|
||||
expect(s(':host(:before) {}', 'a', 'a-host')).toEqual('[a-host]:before {}');
|
||||
expect(s(':host:before {}', 'a', 'a-host')).toEqual('[a-host]:before {}');
|
||||
expect(s(':host:nth-child(8n+1) {}', 'a', 'a-host')).toEqual('[a-host]:nth-child(8n+1) {}');
|
||||
expect(s(':host:nth-of-type(8n+1) {}', 'a', 'a-host'))
|
||||
expect(s(':host(:before) {}', 'contenta', 'a-host')).toEqual('[a-host]:before {}');
|
||||
expect(s(':host:before {}', 'contenta', 'a-host')).toEqual('[a-host]:before {}');
|
||||
expect(s(':host:nth-child(8n+1) {}', 'contenta', 'a-host'))
|
||||
.toEqual('[a-host]:nth-child(8n+1) {}');
|
||||
expect(s(':host:nth-of-type(8n+1) {}', 'contenta', 'a-host'))
|
||||
.toEqual('[a-host]:nth-of-type(8n+1) {}');
|
||||
expect(s(':host(.class):before {}', 'a', 'a-host')).toEqual('.class[a-host]:before {}');
|
||||
expect(s(':host.class:before {}', 'a', 'a-host')).toEqual('.class[a-host]:before {}');
|
||||
expect(s(':host(:not(p)):before {}', 'a', 'a-host')).toEqual('[a-host]:not(p):before {}');
|
||||
expect(s(':host(.class):before {}', 'contenta', 'a-host'))
|
||||
.toEqual('.class[a-host]:before {}');
|
||||
expect(s(':host.class:before {}', 'contenta', 'a-host'))
|
||||
.toEqual('.class[a-host]:before {}');
|
||||
expect(s(':host(:not(p)):before {}', 'contenta', 'a-host'))
|
||||
.toEqual('[a-host]:not(p):before {}');
|
||||
});
|
||||
|
||||
// see b/63672152
|
||||
it('should handle unexpected selectors in the most reasonable way', () => {
|
||||
expect(s('cmp:host {}', 'a', 'a-host')).toEqual('cmp[a-host] {}');
|
||||
expect(s('cmp:host >>> {}', 'a', 'a-host')).toEqual('cmp[a-host] {}');
|
||||
expect(s('cmp:host child {}', 'a', 'a-host')).toEqual('cmp[a-host] child[a] {}');
|
||||
expect(s('cmp:host >>> child {}', 'a', 'a-host')).toEqual('cmp[a-host] child {}');
|
||||
expect(s('cmp :host {}', 'a', 'a-host')).toEqual('cmp [a-host] {}');
|
||||
expect(s('cmp :host >>> {}', 'a', 'a-host')).toEqual('cmp [a-host] {}');
|
||||
expect(s('cmp :host child {}', 'a', 'a-host')).toEqual('cmp [a-host] child[a] {}');
|
||||
expect(s('cmp :host >>> child {}', 'a', 'a-host')).toEqual('cmp [a-host] child {}');
|
||||
expect(s('cmp:host {}', 'contenta', 'a-host')).toEqual('cmp[a-host] {}');
|
||||
expect(s('cmp:host >>> {}', 'contenta', 'a-host')).toEqual('cmp[a-host] {}');
|
||||
expect(s('cmp:host child {}', 'contenta', 'a-host'))
|
||||
.toEqual('cmp[a-host] child[contenta] {}');
|
||||
expect(s('cmp:host >>> child {}', 'contenta', 'a-host')).toEqual('cmp[a-host] child {}');
|
||||
expect(s('cmp :host {}', 'contenta', 'a-host')).toEqual('cmp [a-host] {}');
|
||||
expect(s('cmp :host >>> {}', 'contenta', 'a-host')).toEqual('cmp [a-host] {}');
|
||||
expect(s('cmp :host child {}', 'contenta', 'a-host'))
|
||||
.toEqual('cmp [a-host] child[contenta] {}');
|
||||
expect(s('cmp :host >>> child {}', 'contenta', 'a-host')).toEqual('cmp [a-host] child {}');
|
||||
});
|
||||
});
|
||||
|
||||
describe((':host-context'), () => {
|
||||
it('should handle tag selector', () => {
|
||||
expect(s(':host-context(div) {}', 'a', 'a-host')).toEqual('div[a-host], div [a-host] {}');
|
||||
expect(s(':host-context(ul) > .y {}', 'a', 'a-host'))
|
||||
.toEqual('ul[a-host] > .y[a], ul [a-host] > .y[a] {}');
|
||||
expect(s(':host-context(div) {}', 'contenta', 'a-host'))
|
||||
.toEqual('div[a-host], div [a-host] {}');
|
||||
expect(s(':host-context(ul) > .y {}', 'contenta', 'a-host'))
|
||||
.toEqual('ul[a-host] > .y[contenta], ul [a-host] > .y[contenta] {}');
|
||||
});
|
||||
|
||||
it('should handle class selector', () => {
|
||||
expect(s(':host-context(.x) {}', 'a', 'a-host')).toEqual('.x[a-host], .x [a-host] {}');
|
||||
expect(s(':host-context(.x) {}', 'contenta', 'a-host'))
|
||||
.toEqual('.x[a-host], .x [a-host] {}');
|
||||
|
||||
expect(s(':host-context(.x) > .y {}', 'a', 'a-host'))
|
||||
.toEqual('.x[a-host] > .y[a], .x [a-host] > .y[a] {}');
|
||||
expect(s(':host-context(.x) > .y {}', 'contenta', 'a-host'))
|
||||
.toEqual('.x[a-host] > .y[contenta], .x [a-host] > .y[contenta] {}');
|
||||
});
|
||||
|
||||
it('should handle attribute selector', () => {
|
||||
expect(s(':host-context([a="b"]) {}', 'a', 'a-host'))
|
||||
expect(s(':host-context([a="b"]) {}', 'contenta', 'a-host'))
|
||||
.toEqual('[a="b"][a-host], [a="b"] [a-host] {}');
|
||||
expect(s(':host-context([a=b]) {}', 'a', 'a-host'))
|
||||
expect(s(':host-context([a=b]) {}', 'contenta', 'a-host'))
|
||||
.toEqual('[a=b][a-host], [a="b"] [a-host] {}');
|
||||
});
|
||||
});
|
||||
|
||||
it('should support polyfill-next-selector', () => {
|
||||
let css = s('polyfill-next-selector {content: \'x > y\'} z {}', 'a');
|
||||
expect(css).toEqual('x[a] > y[a]{}');
|
||||
let css = s('polyfill-next-selector {content: \'x > y\'} z {}', 'contenta');
|
||||
expect(css).toEqual('x[contenta] > y[contenta]{}');
|
||||
|
||||
css = s('polyfill-next-selector {content: "x > y"} z {}', 'a');
|
||||
expect(css).toEqual('x[a] > y[a]{}');
|
||||
css = s('polyfill-next-selector {content: "x > y"} z {}', 'contenta');
|
||||
expect(css).toEqual('x[contenta] > y[contenta]{}');
|
||||
|
||||
css = s(`polyfill-next-selector {content: 'button[priority="1"]'} z {}`, 'a');
|
||||
expect(css).toEqual('button[priority="1"][a]{}');
|
||||
css = s(`polyfill-next-selector {content: 'button[priority="1"]'} z {}`, 'contenta');
|
||||
expect(css).toEqual('button[priority="1"][contenta]{}');
|
||||
});
|
||||
|
||||
it('should support polyfill-unscoped-rule', () => {
|
||||
let css = s('polyfill-unscoped-rule {content: \'#menu > .bar\';color: blue;}', 'a');
|
||||
let css = s('polyfill-unscoped-rule {content: \'#menu > .bar\';color: blue;}', 'contenta');
|
||||
expect(css).toContain('#menu > .bar {;color:blue;}');
|
||||
|
||||
css = s('polyfill-unscoped-rule {content: "#menu > .bar";color: blue;}', 'a');
|
||||
css = s('polyfill-unscoped-rule {content: "#menu > .bar";color: blue;}', 'contenta');
|
||||
expect(css).toContain('#menu > .bar {;color:blue;}');
|
||||
|
||||
css = s(`polyfill-unscoped-rule {content: 'button[priority="1"]'}`, 'a');
|
||||
css = s(`polyfill-unscoped-rule {content: 'button[priority="1"]'}`, 'contenta');
|
||||
expect(css).toContain('button[priority="1"] {}');
|
||||
});
|
||||
|
||||
|
@ -212,81 +223,82 @@ export function main() {
|
|||
const css =
|
||||
s('polyfill-unscoped-rule {content: \'foo\';color: blue;}' +
|
||||
'polyfill-unscoped-rule {content: \'bar\';color: blue;}',
|
||||
'a');
|
||||
'contenta');
|
||||
expect(css).toContain('foo {;color:blue;}');
|
||||
expect(css).toContain('bar {;color:blue;}');
|
||||
});
|
||||
|
||||
it('should support polyfill-rule', () => {
|
||||
let css = s('polyfill-rule {content: \':host.foo .bar\';color: blue;}', 'a', 'a-host');
|
||||
expect(css).toEqual('.foo[a-host] .bar[a] {;color:blue;}');
|
||||
let css = s('polyfill-rule {content: \':host.foo .bar\';color: blue;}', 'contenta', 'a-host');
|
||||
expect(css).toEqual('.foo[a-host] .bar[contenta] {;color:blue;}');
|
||||
|
||||
css = s('polyfill-rule {content: ":host.foo .bar";color:blue;}', 'a', 'a-host');
|
||||
expect(css).toEqual('.foo[a-host] .bar[a] {;color:blue;}');
|
||||
css = s('polyfill-rule {content: ":host.foo .bar";color:blue;}', 'contenta', 'a-host');
|
||||
expect(css).toEqual('.foo[a-host] .bar[contenta] {;color:blue;}');
|
||||
|
||||
css = s(`polyfill-rule {content: 'button[priority="1"]'}`, 'a', 'a-host');
|
||||
expect(css).toEqual('button[priority="1"][a] {}');
|
||||
css = s(`polyfill-rule {content: 'button[priority="1"]'}`, 'contenta', 'a-host');
|
||||
expect(css).toEqual('button[priority="1"][contenta] {}');
|
||||
});
|
||||
|
||||
it('should handle ::shadow', () => {
|
||||
const css = s('x::shadow > y {}', 'a');
|
||||
expect(css).toEqual('x[a] > y[a] {}');
|
||||
const css = s('x::shadow > y {}', 'contenta');
|
||||
expect(css).toEqual('x[contenta] > y[contenta] {}');
|
||||
});
|
||||
|
||||
it('should handle /deep/', () => {
|
||||
const css = s('x /deep/ y {}', 'a');
|
||||
expect(css).toEqual('x[a] y {}');
|
||||
const css = s('x /deep/ y {}', 'contenta');
|
||||
expect(css).toEqual('x[contenta] y {}');
|
||||
});
|
||||
|
||||
it('should handle >>>', () => {
|
||||
const css = s('x >>> y {}', 'a');
|
||||
expect(css).toEqual('x[a] y {}');
|
||||
const css = s('x >>> y {}', 'contenta');
|
||||
expect(css).toEqual('x[contenta] y {}');
|
||||
});
|
||||
|
||||
it('should handle ::ng-deep', () => {
|
||||
let css = '::ng-deep y {}';
|
||||
expect(s(css, 'a')).toEqual('y {}');
|
||||
expect(s(css, 'contenta')).toEqual('y {}');
|
||||
css = 'x ::ng-deep y {}';
|
||||
expect(s(css, 'a')).toEqual('x[a] y {}');
|
||||
expect(s(css, 'contenta')).toEqual('x[contenta] y {}');
|
||||
css = ':host > ::ng-deep .x {}';
|
||||
expect(s(css, 'a', 'h')).toEqual('[h] > .x {}');
|
||||
expect(s(css, 'contenta', 'h')).toEqual('[h] > .x {}');
|
||||
css = ':host ::ng-deep > .x {}';
|
||||
expect(s(css, 'a', 'h')).toEqual('[h] > .x {}');
|
||||
expect(s(css, 'contenta', 'h')).toEqual('[h] > .x {}');
|
||||
css = ':host > ::ng-deep > .x {}';
|
||||
expect(s(css, 'a', 'h')).toEqual('[h] > > .x {}');
|
||||
expect(s(css, 'contenta', 'h')).toEqual('[h] > > .x {}');
|
||||
});
|
||||
|
||||
it('should pass through @import directives', () => {
|
||||
const styleStr = '@import url("https://fonts.googleapis.com/css?family=Roboto");';
|
||||
const css = s(styleStr, 'a');
|
||||
const css = s(styleStr, 'contenta');
|
||||
expect(css).toEqual(styleStr);
|
||||
});
|
||||
|
||||
it('should shim rules after @import', () => {
|
||||
const styleStr = '@import url("a"); div {}';
|
||||
const css = s(styleStr, 'a');
|
||||
expect(css).toEqual('@import url("a"); div[a] {}');
|
||||
const css = s(styleStr, 'contenta');
|
||||
expect(css).toEqual('@import url("a"); div[contenta] {}');
|
||||
});
|
||||
|
||||
it('should leave calc() unchanged', () => {
|
||||
const styleStr = 'div {height:calc(100% - 55px);}';
|
||||
const css = s(styleStr, 'a');
|
||||
expect(css).toEqual('div[a] {height:calc(100% - 55px);}');
|
||||
const css = s(styleStr, 'contenta');
|
||||
expect(css).toEqual('div[contenta] {height:calc(100% - 55px);}');
|
||||
});
|
||||
|
||||
it('should strip comments', () => { expect(s('/* x */b {c}', 'a')).toEqual('b[a] {c}'); });
|
||||
it('should strip comments',
|
||||
() => { expect(s('/* x */b {c}', 'contenta')).toEqual('b[contenta] {c}'); });
|
||||
|
||||
it('should ignore special characters in comments',
|
||||
() => { expect(s('/* {;, */b {c}', 'a')).toEqual('b[a] {c}'); });
|
||||
() => { expect(s('/* {;, */b {c}', 'contenta')).toEqual('b[contenta] {c}'); });
|
||||
|
||||
it('should support multiline comments',
|
||||
() => { expect(s('/* \n */b {c}', 'a')).toEqual('b[a] {c}'); });
|
||||
() => { expect(s('/* \n */b {c}', 'contenta')).toEqual('b[contenta] {c}'); });
|
||||
|
||||
it('should keep sourceMappingURL comments', () => {
|
||||
expect(s('b {c}/*# sourceMappingURL=data:x */', 'a'))
|
||||
.toEqual('b[a] {c}/*# sourceMappingURL=data:x */');
|
||||
expect(s('b {c}/* #sourceMappingURL=data:x */', 'a'))
|
||||
.toEqual('b[a] {c}/* #sourceMappingURL=data:x */');
|
||||
expect(s('b {c}/*# sourceMappingURL=data:x */', 'contenta'))
|
||||
.toEqual('b[contenta] {c}/*# sourceMappingURL=data:x */');
|
||||
expect(s('b {c}/* #sourceMappingURL=data:x */', 'contenta'))
|
||||
.toEqual('b[contenta] {c}/* #sourceMappingURL=data:x */');
|
||||
});
|
||||
});
|
||||
|
||||
|
@ -311,13 +323,15 @@ export function main() {
|
|||
|
||||
it('should capture css rules with nested rules', () => {
|
||||
expect(captureRules('a {b {c}} d {e}')).toEqual([
|
||||
new CssRule('a', 'b {c}'), new CssRule('d', 'e')
|
||||
new CssRule('a', 'b {c}'),
|
||||
new CssRule('d', 'e'),
|
||||
]);
|
||||
});
|
||||
|
||||
it('should capture multiple rules where some have no body', () => {
|
||||
expect(captureRules('@import a ; b {c}')).toEqual([
|
||||
new CssRule('@import a', ''), new CssRule('b', 'c')
|
||||
new CssRule('@import a', ''),
|
||||
new CssRule('b', 'c'),
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue