Make aliases affect safe-prefixed rules

src/parsers/declarations.ts

@@ -178,18 +178,33 @@ export const parseDeclarations = (
             const declPropUnprefixed = vendor.unprefixed(declProp);
             const declValue = decl.value.trim();
             const declIndexes = Object.keys(declarationHashMap[declProp].indexes).map(Number);
-            const isAnimation = declPropUnprefixed === ANIMATION_PROP || declPropUnprefixed === ANIMATION_NAME_PROP;
+            const isAnimation = (
+                declPropUnprefixed === ANIMATION_PROP ||
+                declPropUnprefixed === ANIMATION_NAME_PROP ||
+                aliases[declPropUnprefixed] === ANIMATION_PROP ||
+                aliases[declPropUnprefixed] === ANIMATION_NAME_PROP
+            );
             const declFlippedProp = declFlipped.prop.trim();
             const declFlippedValue = declFlipped.value.trim();
-            const overridenBy = declarations[declPropUnprefixed];
-            const hasBeenOverriden = declarationsProps.includes(declPropUnprefixed) || (
-                overridenBy
-                    ? overridenBy.some((d: string): boolean => declarationsProps.indexOf(d) >= 0)
-                    : false
+            const overridenBy = aliases[declPropUnprefixed]
+                ? declarations[aliases[declPropUnprefixed]]
+                : declarations[declPropUnprefixed];
+            const hasBeenOverriden = (
+                declarationsProps.includes(declPropUnprefixed) ||
+                declarationsProps.includes(aliases[declPropUnprefixed]) ||
+                (
+                    overridenBy
+                        ? overridenBy.some((d: string): boolean => declarationsProps.indexOf(d) >= 0)
+                        : false
+                )
             );
-            const overridesPrevious = checkOverrides(declPropUnprefixed, declarationsProps);
+            const overridesPrevious = aliases[declPropUnprefixed]
+                ? checkOverrides(aliases[declPropUnprefixed], declarationsProps)
+                : checkOverrides(declPropUnprefixed, declarationsProps);
             const isConflictedDeclaration = safeBothPrefix
-                ? !!allDeclarations[declPropUnprefixed]
+                ? aliases[declPropUnprefixed]
+                    ? !!(allDeclarations[aliases[declPropUnprefixed]])
+                    : !!(allDeclarations[declPropUnprefixed])
                 : false;
             const sourceDirectiveValue = getSourceDirectiveValue(
                 controlDirectives,

tests/__snapshots__/aliases-custom-declarations/combined/no-aliases-safe-both-prefix-false.snapshot

@@ -0,0 +1,43 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: combined]] Aliases Tests: without aliases and safeBothPrefix false 1`] = `
+".test1 {
+    view-timeline: --row-a block;
+    animation-range: cover 0% cover 100%;
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+[dir="ltr"] .test1 {
+    transform: translate3d(-21vh, 0, 0);
+}
+
+[dir="rtl"] .test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+    color: white;
+    custom-border-width: 2px;
+}
+
+.test3 {
+    custom-clip-background: text;
+    color: rgba(255, 242, 126, 1);
+    custom-padding: 20px;
+}
+
+[dir="ltr"] .test3 {
+    background: linear-gradient(180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir="rtl"] .test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir] .test3 {
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/combined/no-aliases-safe-both-prefix-true.snapshot

@@ -0,0 +1,49 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: combined]] Aliases Tests: without aliases and safeBothPrefix true 1`] = `
+".test1 {
+    view-timeline: --row-a block;
+    animation-range: cover 0% cover 100%;
+}
+
+[dir] .test1 {
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+[dir="ltr"] .test1 {
+    transform: translate3d(-21vh, 0, 0);
+}
+
+[dir="rtl"] .test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test2 {
+    color: white;
+    custom-border-width: 2px;
+}
+
+[dir] .test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+}
+
+.test3 {
+    custom-clip-background: text;
+    color: rgba(255, 242, 126, 1);
+    custom-padding: 20px;
+}
+
+[dir="ltr"] .test3 {
+    background: linear-gradient(180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir="rtl"] .test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir] .test3 {
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/combined/with-aliases-safe-both-prefix-false.snapshot

@@ -0,0 +1,43 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: combined]] Aliases Tests: with aliases and safeBothPrefix false 1`] = `
+".test1 {
+    view-timeline: --row-a block;
+    animation-range: cover 0% cover 100%;
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+[dir="ltr"] .test1 {
+    transform: translate3d(-21vh, 0, 0);
+}
+
+[dir="rtl"] .test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+    color: white;
+    custom-border-width: 2px;
+}
+
+.test3 {
+    color: rgba(255, 242, 126, 1);
+    custom-padding: 20px;
+}
+
+[dir="ltr"] .test3 {
+    background: linear-gradient(180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir="rtl"] .test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir] .test3 {
+    custom-clip-background: text;
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/combined/with-aliases-safe-both-prefix-true.snapshot

@@ -0,0 +1,52 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: combined]] Aliases Tests: with aliases and safeBothPrefix true 1`] = `
+".test1 {
+    animation-range: cover 0% cover 100%;
+}
+
+[dir] .test1 {
+    view-timeline: --row-a block;
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+[dir="ltr"] .test1 {
+    transform: translate3d(-21vh, 0, 0);
+}
+
+[dir="rtl"] .test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test2 {
+    color: white;
+}
+
+[dir] .test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+    custom-border-width: 2px;
+}
+
+.test3 {
+    color: rgba(255, 242, 126, 1);
+}
+
+[dir] .test3 {
+    custom-padding: 20px;
+}
+
+[dir="ltr"] .test3 {
+    background: linear-gradient(180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir="rtl"] .test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir] .test3 {
+    custom-clip-background: text;
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/diff/no-aliases-safe-both-prefix-false.snapshot

@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: diff]] Aliases Tests: without aliases and safeBothPrefix false 1`] = `
+".test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/diff/no-aliases-safe-both-prefix-true.snapshot

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: diff]] Aliases Tests: without aliases and safeBothPrefix true 1`] = `
+".test1 {
+    transform: translate3d(21vh, 0, 0);
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+.test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+}
+
+.test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/diff/with-aliases-safe-both-prefix-false.snapshot

@@ -0,0 +1,13 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: diff]] Aliases Tests: with aliases and safeBothPrefix false 1`] = `
+".test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+    custom-clip-background: text;
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/diff/with-aliases-safe-both-prefix-true.snapshot

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: diff]] Aliases Tests: with aliases and safeBothPrefix true 1`] = `
+".test1 {
+    transform: translate3d(21vh, 0, 0);
+    view-timeline: --row-a block;
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+.test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+    custom-border-width: 2px;
+}
+
+.test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+    custom-clip-background: text;
+    background-position: top;
+    custom-padding: 20px;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/override/no-aliases-safe-both-prefix-false.snapshot

@@ -0,0 +1,37 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: override]] Aliases Tests: without aliases and safeBothPrefix false 1`] = `
+".test1 {
+    transform: translate3d(-21vh, 0, 0);
+    view-timeline: --row-a block;
+    animation-range: cover 0% cover 100%;
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+[dir="rtl"] .test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+    color: white;
+    custom-border-width: 2px;
+}
+
+.test3 {
+    background: linear-gradient(180deg, #fff27e 0%, #ffffff 100%);
+    custom-clip-background: text;
+    color: rgba(255, 242, 126, 1);
+    custom-padding: 20px;
+}
+
+[dir="rtl"] .test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir] .test3 {
+    background-position: top;
+}"
+`;

tests/__snapshots__/aliases-custom-declarations/override/no-aliases-safe-both-prefix-true.snapshot

@@ -0,0 +1,46 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`[[Mode: override]] Aliases Tests: without aliases and safeBothPrefix true 1`] = `
+".test1 {
+    view-timeline: --row-a block;
+    animation-range: cover 0% cover 100%;
+}
+
+[dir] .test1 {
+    transform: translate3d(-21vh, 0, 0);
+    animation-timing-function: var(--timing-function);
+    animation-name: slide-in;
+}
+
+[dir="rtl"] .test1 {
+    transform: translate3d(21vh, 0, 0);
+}
+
+.test2 {
+    color: white;
+    custom-border-width: 2px;
+}
+
+[dir] .test2 {
+    border: 1px solid;
+    border-color: #FF00FF;
+}
+
+.test3 {
+    custom-clip-background: text;
+    color: rgba(255, 242, 126, 1);
+    custom-padding: 20px;
+}
+
+[dir] .test3 {
+    background: linear-gradient(180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir="rtl"] .test3 {
+    background: linear-gradient(-180deg, #fff27e 0%, #ffffff 100%);
+}
+
+[dir] .test3 {
+    background-position: top;
+}"
+`;