216d03dae3
Also move the addHoverClass implementation into the rebuild stage. So if there is still some corner case we have not handled, it will only affect the replayer part of rrweb.
44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import 'mocha';
|
|
import { expect } from 'chai';
|
|
import { addHoverClass } from '../src/rebuild';
|
|
|
|
describe('add hover class to hover selector related rules', () => {
|
|
it('will do nothing to css text without :hover', () => {
|
|
const cssText = 'body { color: white }';
|
|
expect(addHoverClass(cssText)).to.equal(cssText);
|
|
});
|
|
|
|
it('can add hover class to css text', () => {
|
|
const cssText = '.a:hover { color: white }';
|
|
expect(addHoverClass(cssText)).to.equal(
|
|
'.a:hover, .a.\\:hover { color: white }',
|
|
);
|
|
});
|
|
|
|
it('can add hover class when there is multi selector', () => {
|
|
const cssText = '.a, .b:hover, .c { color: white }';
|
|
expect(addHoverClass(cssText)).to.equal(
|
|
'.a, .b:hover, .b.\\:hover, .c { color: white }',
|
|
);
|
|
});
|
|
|
|
it('can add hover class when :hover is not the end of selector', () => {
|
|
const cssText = 'div:hover::after { color: white }';
|
|
expect(addHoverClass(cssText)).to.equal(
|
|
'div:hover::after, div.\\:hover::after { color: white }',
|
|
);
|
|
});
|
|
|
|
it('can add hover class when the selector has multi :hover', () => {
|
|
const cssText = 'a:hover b:hover { color: white }';
|
|
expect(addHoverClass(cssText)).to.equal(
|
|
'a:hover b:hover, a.\\:hover b.\\:hover { color: white }',
|
|
);
|
|
});
|
|
|
|
it('will ignore :hover in css value', () => {
|
|
const cssText = '.a::after { content: ":hover" }';
|
|
expect(addHoverClass(cssText)).to.equal(cssText);
|
|
});
|
|
});
|