80 lines
3.0 KiB
JavaScript
80 lines
3.0 KiB
JavaScript
import { Stylesheet } from '@fluentui/merge-styles';
|
|
import { classNamesFunction } from './classNamesFunction';
|
|
import { getRTL, setRTL } from './rtl';
|
|
describe('classNamesFunction', function () {
|
|
beforeEach(function () {
|
|
Stylesheet.getInstance().reset();
|
|
Stylesheet.getInstance().setConfig({
|
|
onInsertRule: function () {
|
|
/*no-op*/
|
|
},
|
|
});
|
|
});
|
|
afterEach(function () {
|
|
Stylesheet.getInstance().setConfig({
|
|
onInsertRule: undefined,
|
|
});
|
|
});
|
|
it('can cache rules', function () {
|
|
var styleFunction1Called = false;
|
|
var styleFunction2Called = false;
|
|
var getClassNames = classNamesFunction();
|
|
var getStyles1 = function (props) {
|
|
styleFunction1Called = true;
|
|
return {
|
|
root: { width: props.a },
|
|
};
|
|
};
|
|
var getStyles2 = function (props) {
|
|
styleFunction2Called = true;
|
|
return {
|
|
root: { height: props.a },
|
|
};
|
|
};
|
|
var classNames1 = getClassNames(getStyles1, { a: 1, b: 'test' });
|
|
var classNames2 = getClassNames(getStyles2, { a: 1, b: 'test' });
|
|
expect(styleFunction1Called).toEqual(true);
|
|
expect(styleFunction2Called).toEqual(true);
|
|
styleFunction1Called = false;
|
|
styleFunction2Called = false;
|
|
expect(getClassNames(getStyles1, { a: 1, b: 'test' })).toEqual(classNames1);
|
|
expect(styleFunction1Called).toEqual(false);
|
|
expect(getClassNames(getStyles2, { a: 1, b: 'test' })).toEqual(classNames2);
|
|
expect(styleFunction2Called).toEqual(false);
|
|
expect(getClassNames(getStyles1, { a: 2, b: 'test' })).not.toEqual(classNames1);
|
|
expect(styleFunction1Called).toEqual(true);
|
|
styleFunction1Called = false;
|
|
getClassNames(getStyles1, { a: 2, b: 'test' });
|
|
expect(styleFunction1Called).toEqual(false);
|
|
});
|
|
describe('ltr/rtl from theme', function () {
|
|
var originalRtl;
|
|
var setRule;
|
|
beforeEach(function () {
|
|
Stylesheet.getInstance().setConfig({
|
|
onInsertRule: function (rule) {
|
|
setRule = rule;
|
|
},
|
|
});
|
|
});
|
|
beforeEach(function () { return (originalRtl = getRTL()); });
|
|
afterEach(function () { return setRTL(originalRtl); });
|
|
var getClassNames = classNamesFunction();
|
|
var getStyles = function () {
|
|
return {
|
|
root: { left: 1 },
|
|
};
|
|
};
|
|
it('renders rtl if specified in theme', function () {
|
|
setRTL(false);
|
|
getClassNames(getStyles, { theme: { rtl: true } });
|
|
expect(setRule).toEqual('.root-0{right:1px;}');
|
|
});
|
|
it('renders ltr if specified in theme', function () {
|
|
setRTL(true);
|
|
getClassNames(getStyles, { theme: { rtl: false } });
|
|
expect(setRule).toEqual('.root-0{left:1px;}');
|
|
});
|
|
});
|
|
});
|
|
//# sourceMappingURL=classNamesFunction.test.js.map
|