1 | import { mount } from 'enzyme';
|
2 | import React from 'react';
|
3 | import { StyleSheet } from 'react-native';
|
4 |
|
5 | import { BlurView } from '..';
|
6 |
|
7 | const getStyleProp = (component, prop) => StyleSheet.flatten(component.prop('style'))[prop];
|
8 |
|
9 |
|
10 | const originalCSS = global.CSS;
|
11 |
|
12 | beforeEach(() => {
|
13 |
|
14 | global.CSS = {
|
15 | supports() {
|
16 | return true;
|
17 | },
|
18 | };
|
19 | });
|
20 |
|
21 | afterAll(() => {
|
22 |
|
23 | global.CSS = originalCSS;
|
24 | });
|
25 |
|
26 | it(`prefers filters to background color`, () => {
|
27 | const withNativeBlur = mount(<BlurView tint="light" />);
|
28 | expect(getStyleProp(withNativeBlur.find('div'), 'WebkitBackdropFilter')).toBeDefined();
|
29 | expect(getStyleProp(withNativeBlur.find('div'), 'backdropFilter')).toBeDefined();
|
30 | });
|
31 |
|
32 | it(`uses a transparent background color when filters aren't supported`, () => {
|
33 |
|
34 | global.CSS = undefined;
|
35 |
|
36 | const withoutNativeBlur = mount(<BlurView tint="light" />);
|
37 | expect(getStyleProp(withoutNativeBlur.find('div'), 'WebkitBackdropFilter')).not.toBeDefined();
|
38 | expect(getStyleProp(withoutNativeBlur.find('div'), 'backdropFilter')).not.toBeDefined();
|
39 | expect(getStyleProp(withoutNativeBlur.find('div'), 'backgroundColor')).toBeDefined();
|
40 | });
|