diff --git a/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap b/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap index c5d22bea8..597eebcf9 100644 --- a/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap +++ b/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap @@ -16,11 +16,11 @@ exports[`AppRegistry runApplication styles roots in different documents 1`] = ` ".r-bottom-1p0dtai {bottom: 0px;}", ".r-left-1d2f490 {left: 0px;}", ".r-pointerEvents-105ug2t {pointer-events: auto !important;}", - ".r-pointerEvents-12vffkv * {pointer-events: auto;}", + ".r-pointerEvents-12vffkv>* {pointer-events: auto;}", ".r-pointerEvents-12vffkv {pointer-events: none !important;}", - ".r-pointerEvents-633pao * {pointer-events: none;}", + ".r-pointerEvents-633pao>* {pointer-events: none;}", ".r-pointerEvents-633pao {pointer-events: none !important;}", - ".r-pointerEvents-ah5dr5 * {pointer-events: none;}", + ".r-pointerEvents-ah5dr5>* {pointer-events: none;}", ".r-pointerEvents-ah5dr5 {pointer-events: auto !important;}", ".r-position-u8s1d {position: absolute;}", ".r-right-zchlnj {right: 0px;}", @@ -44,11 +44,11 @@ exports[`AppRegistry runApplication styles roots in different documents 2`] = ` ".r-bottom-1p0dtai {bottom: 0px;}", ".r-left-1d2f490 {left: 0px;}", ".r-pointerEvents-105ug2t {pointer-events: auto !important;}", - ".r-pointerEvents-12vffkv * {pointer-events: auto;}", + ".r-pointerEvents-12vffkv>* {pointer-events: auto;}", ".r-pointerEvents-12vffkv {pointer-events: none !important;}", - ".r-pointerEvents-633pao * {pointer-events: none;}", + ".r-pointerEvents-633pao>* {pointer-events: none;}", ".r-pointerEvents-633pao {pointer-events: none !important;}", - ".r-pointerEvents-ah5dr5 * {pointer-events: none;}", + ".r-pointerEvents-ah5dr5>* {pointer-events: none;}", ".r-pointerEvents-ah5dr5 {pointer-events: auto !important;}", ".r-position-u8s1d {position: absolute;}", ".r-right-zchlnj {right: 0px;}", diff --git a/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js b/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js index 821b73b1d..082bdd1fe 100644 --- a/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js +++ b/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js @@ -61,11 +61,11 @@ describe('AppRegistry', () => { .r-left-1d2f490{left:0px;} .r-maxWidth-dnmrzs{max-width:100%;} .r-pointerEvents-105ug2t{pointer-events:auto!important;} - .r-pointerEvents-12vffkv * {pointer-events:auto;} + .r-pointerEvents-12vffkv>* {pointer-events:auto;} .r-pointerEvents-12vffkv{pointer-events:none!important;} - .r-pointerEvents-633pao * {pointer-events:none;} + .r-pointerEvents-633pao>* {pointer-events:none;} .r-pointerEvents-633pao{pointer-events:none!important;} - .r-pointerEvents-ah5dr5 * {pointer-events:none;} + .r-pointerEvents-ah5dr5>* {pointer-events:none;} .r-pointerEvents-ah5dr5{pointer-events:auto!important;} .r-position-u8s1d{position:absolute;} .r-right-zchlnj{right:0px;} @@ -120,11 +120,11 @@ describe('AppRegistry', () => { .r-left-1d2f490{left:0px;} .r-maxWidth-dnmrzs{max-width:100%;} .r-pointerEvents-105ug2t{pointer-events:auto!important;} - .r-pointerEvents-12vffkv * {pointer-events:auto;} + .r-pointerEvents-12vffkv>* {pointer-events:auto;} .r-pointerEvents-12vffkv{pointer-events:none!important;} - .r-pointerEvents-633pao * {pointer-events:none;} + .r-pointerEvents-633pao>* {pointer-events:none;} .r-pointerEvents-633pao{pointer-events:none!important;} - .r-pointerEvents-ah5dr5 * {pointer-events:none;} + .r-pointerEvents-ah5dr5>* {pointer-events:none;} .r-pointerEvents-ah5dr5{pointer-events:auto!important;} .r-position-u8s1d{position:absolute;} .r-right-zchlnj{right:0px;} @@ -172,11 +172,11 @@ describe('AppRegistry', () => { .r-left-1d2f490{left:0px;} .r-maxWidth-dnmrzs{max-width:100%;} .r-pointerEvents-105ug2t{pointer-events:auto!important;} - .r-pointerEvents-12vffkv * {pointer-events:auto;} + .r-pointerEvents-12vffkv>* {pointer-events:auto;} .r-pointerEvents-12vffkv{pointer-events:none!important;} - .r-pointerEvents-633pao * {pointer-events:none;} + .r-pointerEvents-633pao>* {pointer-events:none;} .r-pointerEvents-633pao{pointer-events:none!important;} - .r-pointerEvents-ah5dr5 * {pointer-events:none;} + .r-pointerEvents-ah5dr5>* {pointer-events:none;} .r-pointerEvents-ah5dr5{pointer-events:auto!important;} .r-position-u8s1d{position:absolute;} .r-right-zchlnj{right:0px;} diff --git a/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js b/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js index 6709f69e1..e47121b1b 100644 --- a/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js +++ b/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js @@ -142,7 +142,7 @@ describe('StyleSheet/compile', () => { ], [ [ - ".r-pointerEvents-ah5dr5 * {pointer-events:none;}", + ".r-pointerEvents-ah5dr5>* {pointer-events:none;}", ".r-pointerEvents-ah5dr5{pointer-events:auto!important;}", ], 3, @@ -191,7 +191,7 @@ describe('StyleSheet/compile', () => { [ [ [ - ".r-pointerEvents-633pao * {pointer-events:none;}", + ".r-pointerEvents-633pao>* {pointer-events:none;}", ".r-pointerEvents-633pao{pointer-events:none!important;}", ], 3, @@ -215,7 +215,7 @@ describe('StyleSheet/compile', () => { [ [ [ - ".r-pointerEvents-12vffkv * {pointer-events:auto;}", + ".r-pointerEvents-12vffkv>* {pointer-events:auto;}", ".r-pointerEvents-12vffkv{pointer-events:none!important;}", ], 3, diff --git a/packages/react-native-web/src/exports/StyleSheet/compiler/index.js b/packages/react-native-web/src/exports/StyleSheet/compiler/index.js index 7649d9888..61f9f5c35 100644 --- a/packages/react-native-web/src/exports/StyleSheet/compiler/index.js +++ b/packages/react-native-web/src/exports/StyleSheet/compiler/index.js @@ -387,15 +387,15 @@ function createAtomicRules(identifier: string, property, value): Rules { } else if (value === 'none') { finalValue = 'none!important'; const block = createDeclarationBlock({ pointerEvents: 'none' }); - rules.push(`${selector} * ${block}`); + rules.push(`${selector}>* ${block}`); } else if (value === 'box-none') { finalValue = 'none!important'; const block = createDeclarationBlock({ pointerEvents: 'auto' }); - rules.push(`${selector} * ${block}`); + rules.push(`${selector}>* ${block}`); } else if (value === 'box-only') { finalValue = 'auto!important'; const block = createDeclarationBlock({ pointerEvents: 'none' }); - rules.push(`${selector} * ${block}`); + rules.push(`${selector}>* ${block}`); } const block = createDeclarationBlock({ pointerEvents: finalValue }); rules.push(`${selector}${block}`);