kylefang/nativewind
1
0
Fork 0
mirror of https://github.com/zhigang1992/nativewind.git synced 2026-06-15 18:27:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

ci: tests for transform

Browse Source
This commit is contained in:
Mark Lawlor
2022-10-18 13:04:20 +10:00
parent fa046c4e7c
commit 1fcbf122b0
8 changed files with 71 additions and 204 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
packages/nativewind/__tests__/archive/tailwindcss/font-weight.ts
View File

@@ -1,19 +0,0 @@
import { TextStyle } from "react-native";
import { createTests, tailwindRunner } from "./runner";
const scenarios: Record<string, TextStyle["fontWeight"]> = {
thin: "100",
extralight: "200",
light: "300",
normal: "400",
medium: "500",
semibold: "600",
bold: "700",
extrabold: "800",
black: "900",
};
tailwindRunner(
"Typography - Font Weight",
createTests("font", scenarios, (n) => ({ fontWeight: n }))
);

18
packages/nativewind/__tests__/archive/tailwindcss/rotate.ts
View File

@@ -1,18 +0,0 @@
import { tailwindRunner } from "./runner";
tailwindRunner("Layout - Scale", [
[
"rotate-0",
{
styles: { "rotate-0": { transform: [{ rotate: "0deg" }] } },
transforms: { "rotate-0": true },
},
],
[
"rotate-45",
{
styles: { "rotate-45": { transform: [{ rotate: "45deg" }] } },
transforms: { "rotate-45": true },
},
],
]);

32
packages/nativewind/__tests__/archive/tailwindcss/scale.ts
View File

@@ -1,32 +0,0 @@
import { tailwindRunner } from "./runner";
tailwindRunner("Layout - Scale", [
[
"scale-0",
{
styles: { "scale-0": { transform: [{ scaleY: 0 }, { scaleX: 0 }] } },
transforms: { "scale-0": true },
},
],
[
"scale-50",
{
styles: { "scale-50": { transform: [{ scaleY: 0.5 }, { scaleX: 0.5 }] } },
transforms: { "scale-50": true },
},
],
[
"scale-x-50",
{
styles: { "scale-x-50": { transform: [{ scaleX: 0.5 }] } },
transforms: { "scale-x-50": true },
},
],
[
"scale-y-50",
{
styles: { "scale-y-50": { transform: [{ scaleY: 0.5 }] } },
transforms: { "scale-y-50": true },
},
],
]);

32
packages/nativewind/__tests__/archive/tailwindcss/skew.ts
View File

@@ -1,32 +0,0 @@
import { tailwindRunner } from "./runner";
tailwindRunner("Layout - Skew", [
[
"skew-x-0",
{
styles: { "skew-x-0": { transform: [{ skewX: "0deg" }] } },
transforms: { "skew-x-0": true },
},
],
[
"skew-y-0",
{
styles: { "skew-y-0": { transform: [{ skewY: "0deg" }] } },
transforms: { "skew-y-0": true },
},
],
[
"skew-x-1",
{
styles: { "skew-x-1": { transform: [{ skewX: "1deg" }] } },
transforms: { "skew-x-1": true },
},
],
[
"skew-y-1",
{
styles: { "skew-y-1": { transform: [{ skewY: "1deg" }] } },
transforms: { "skew-y-1": true },
},
],
]);

91
packages/nativewind/__tests__/archive/tailwindcss/translate.ts
View File

@@ -1,91 +0,0 @@
import { tailwindRunner, expectError } from "./runner";
tailwindRunner(
"Layout - Translate",
[
[
"translate-x-0",
{
styles: {
"translate-x-0": {
transform: [{ translateY: 0 }, { translateX: 0 }],
},
},
transforms: {
"translate-x-0": true,
},
},
],
[
"translate-y-0",
{
styles: {
"translate-y-0": {
transform: [{ translateY: 0 }, { translateX: 0 }],
},
},
transforms: {
"translate-y-0": true,
},
},
],
[
"translate-x-px",
{
styles: {
"translate-x-px": {
transform: [{ translateY: 0 }, { translateX: 1 }],
},
},
transforms: {
"translate-x-px": true,
},
},
],
[
"translate-y-px",
{
styles: {
"translate-y-px": {
transform: [{ translateY: 1 }, { translateX: 0 }],
},
},
transforms: {
"translate-y-px": true,
},
},
],
[
"translate-x-1",
{
styles: {
"translate-x-1": {
transform: [{ translateY: 0 }, { translateX: 4 }],
},
},
transforms: {
"translate-x-1": true,
},
},
],
[
"translate-y-1",
{
styles: {
"translate-y-1": {
transform: [{ translateY: 4 }, { translateX: 0 }],
},
},
transforms: {
"translate-y-1": true,
},
},
],
],
expectError([
"translate-x-1/3",
"translate-y-1/3",
"translate-x-full",
"translate-y-full",
])
);

56
packages/nativewind/__tests__/tailwind-serialization/kitchen-sink.ts
View File

@@ -232,6 +232,14 @@ testCompile(
border-collapse
// Tables - Table Layout
table-fixed
// Transforms - Rotate
rotate-45
// Transforms - Scale
scale-50
// Transforms - Skew
skew-x-1
// Transforms - Translate
translate-x-px
// Transforms - Transform Origin
origin-top
// Transitions & Animation - Transition Delay
@@ -814,6 +822,54 @@ testCompile(
},
],
},
"rotate-45": {
styles: [
{
transform: [
{
rotate: 45,
},
],
},
],
},
"scale-50": {
styles: [
{
transform: [
{
scale: 0.5,
},
],
},
],
},
"skew-x-1": {
styles: [
{
transform: [
{
skewX: 1,
},
],
},
],
},
"translate-x-px": {
styles: [
{
transform: [
{
translate: 1,
},
],
},
],
},
"z-10": {
styles: [
{

26
packages/nativewind/src/tailwind/index.ts
View File

@@ -69,24 +69,26 @@ const preset: Config = {
scale,
skew,
rotate,
translate
translate,
],
corePlugins: {
// We do not support scoped variables
divideOpacity: false,
backgroundOpacity: false,
borderOpacity: false,
boxShadow: false,
boxShadowColor: false,
divideColor: false,
divideOpacity: false,
divideStyle: false,
divideWidth: false,
gap: false,
placeholderOpacity: false,
ringOpacity: false,
backgroundOpacity: false,
textOpacity: false,
boxShadowColor: false,
boxShadow: false,
// These libraries are replaced with custom logic
gap: false,
space: false,
divideWidth: false,
divideColor: false,
divideStyle: false,
textOpacity: false,
scale: false,
skew: false,
rotate: false,
translate: false,
},
};

1
packages/nativewind/src/transform-css/transforms/transform.ts
View File

@@ -28,6 +28,7 @@ export function transform(node: Declaration, meta: SelectorMeta) {
case "scale":
case "scaleX":
case "scaleY":
case "translate":
case "translateX":
case "translateY":
case "matrix": {