@tdb/util
Version:
Shared helpers and utilities.
77 lines • 3.69 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var chai_1 = require("chai");
var css_1 = require("../css");
var __1 = require("..");
var browserWindow = global;
var image = __1.css.image;
describe('React: CSS - image', function () {
describe('image()', function () {
afterEach(function () {
delete browserWindow.devicePixelRatio;
});
it('is attached to the [css] function as a property', function () {
chai_1.expect(__1.css.image).to.equal(image);
});
it('throws if an image was not specified', function () {
chai_1.expect(function () {
image(undefined, undefined);
}).to.throw();
});
it('returns the 1x resolution', function () {
browserWindow.devicePixelRatio = 1;
var result = image('1x', '2x');
chai_1.expect(result.backgroundImage).to.equal('url(1x)');
});
it('returns the 2x resolution', function () {
browserWindow.devicePixelRatio = 2;
var result = image('1x.png', '2x.png');
chai_1.expect(result.backgroundImage).to.equal('url(1x.png)');
chai_1.expect(result[css_1.MEDIA_QUERY_RETINA].backgroundImage).to.equal('url(2x.png)');
});
it('returns the 1x resolution on hi-res screen when no 2x image (undefined)', function () {
browserWindow.devicePixelRatio = 2;
chai_1.expect(image('1x', undefined, { width: 10, height: 20 }).backgroundImage).to.equal('url(1x)');
});
it('has width and height values (defaults)', function () {
var result = image('1x', '2x');
chai_1.expect(result.width).to.equal(10);
chai_1.expect(result.height).to.equal(10);
});
it('has width and height values (specified)', function () {
var result = image('1x', '2x', { width: 20, height: 150 });
chai_1.expect(result.width).to.equal(20);
chai_1.expect(result.height).to.equal(150);
});
it('has [backgroundSize]', function () {
var result = image('1x', '2x', { width: 20, height: 150 });
chai_1.expect(result.backgroundSize).to.equal('20px 150px');
});
it('does not repeat the background', function () {
var result = image('1x', '2x', { width: 20, height: 150 });
chai_1.expect(result.backgroundRepeat).to.equal('no-repeat');
});
});
describe('Image replacement via css() method', function () {
it('replaces `Image` with style settings (1x)', function () {
browserWindow.devicePixelRatio = 1;
var style = css_1.transformStyle({ Image: ['1x', '2x', 20, 30] });
chai_1.expect(style.Image).to.equal(undefined);
chai_1.expect(style.backgroundImage).to.equal('url(1x)');
chai_1.expect(style.width).to.equal(20);
chai_1.expect(style.height).to.equal(30);
chai_1.expect(style.backgroundSize).to.equal('20px 30px');
chai_1.expect(style.backgroundRepeat).to.equal('no-repeat');
});
it('replaces `Image` with style settings (2x)', function () {
browserWindow.devicePixelRatio = 2;
var style = css_1.transformStyle({
Image: ['1x.JPG', '2x.JPG', 20, 30],
});
chai_1.expect(style.Image).to.equal(undefined);
chai_1.expect(style.backgroundImage).to.equal('url(1x.JPG)');
chai_1.expect(style[css_1.MEDIA_QUERY_RETINA].backgroundImage).to.equal('url(2x.JPG)');
});
});
});
//# sourceMappingURL=css-image.test.js.map