Merge pull request #33 from mertasan/gradient-stops

Remove gradient tests

Author: mertasan

__tests__/color-variable-helper.test.html

@@ -8,9 +8,6 @@
 <div class="bg-green bg-opacity-50">tailwindcss-variables</div>
 <div class="bg-white bg-opacity-50">tailwindcss-variables</div>
 <div class="bg-yellow bg-opacity-50">tailwindcss-variables</div>
-<div class="bg-gradient-to-r from-red-400 to-transparent"></div>
-<div class="bg-gradient-to-r from-red-500 to-transparent"></div>
-<div class="bg-gradient-to-r from-red-600 to-transparent"></div>
 
 <div class="bg-indigo-400">tailwindcss-variables</div>
 <div class="bg-indigo-500">tailwindcss-variables</div>

__tests__/color-variable-helper.test.js

@@ -283,143 +283,3 @@ test('colorVariable - background and text color 2', async () => {
     "
   `)
 })
-
-test('colorVariable with gradient color stops', async () => {
-  expect(
-    await utils.diffOnly({
-      corePlugins: ['textColor', 'textOpacity', 'gradientColorStops'],
-      content: [utils.content()],
-
-      darkMode: false,
-      theme: {
-        screens: false,
-        colors: {
-          red: {
-            400: colorVariable('var(--colors-red-400)'), // RGBA
-            500: colorVariable('var(--colors-red-500)'), // RGBA
-            600: colorVariable('var(--colors-red-600)'), // HEX
-          },
-        },
-
-        variables: {
-          DEFAULT: {
-            colors: {
-              red: {
-                400: 'rgba(254,0,0,1)',
-                500: 'rgba(254,0,0,0.5)',
-                600: '#a20606',
-              },
-            },
-          },
-        },
-      },
-
-      plugins: [
-        tailwindcssVariables({
-          colorVariables: true,
-        }),
-      ],
-    })
-  ).toMatchInlineSnapshot(`
-    "
-
-      
-      + :root {
-      +   --colors-red-400: rgba(254,0,0,1);
-      +   --colors-red-500: rgba(254,0,0,0.5);
-      +   --colors-red-600: #a20606;
-      +   --colors-red-400-rgb: 254,0,0;
-      +   --colors-red-500-rgb: 254,0,0;
-      +   --colors-red-600-rgb: 162,6,6
-      + }
-      + .from-red-400 {
-      +   --tw-gradient-from: rgb(var(--colors-red-400-rgb));
-      +   --tw-gradient-to: rgba(var(--colors-red-400-rgb), 0);
-      +   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
-      + }
-      + .from-red-500 {
-      +   --tw-gradient-from: rgb(var(--colors-red-500-rgb));
-      +   --tw-gradient-to: rgba(var(--colors-red-500-rgb), 0);
-      +   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
-      + }
-      + .from-red-600 {
-      +   --tw-gradient-from: rgb(var(--colors-red-600-rgb));
-      +   --tw-gradient-to: rgba(var(--colors-red-600-rgb), 0);
-      +   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
-      + }
-      + .text-opacity-50 {
-      +   --tw-text-opacity: 0.5
-      + }
-
-    "
-  `)
-})
-
-test('colorVariable with gradient color stops (forceRGB)', async () => {
-  expect(
-    await utils.diffOnly({
-      corePlugins: ['textColor', 'textOpacity', 'gradientColorStops'],
-      content: [utils.content()],
-
-      darkMode: false,
-      theme: {
-        screens: false,
-        colors: {
-          red: {
-            400: colorVariable('var(--colors-red-400)', true), // RGBA
-            500: colorVariable('var(--colors-red-500)', true), // RGBA
-            600: colorVariable('var(--colors-red-600)', true), // HEX
-          },
-        },
-
-        variables: {
-          DEFAULT: {
-            colors: {
-              red: {
-                400: 'rgba(254,0,0,1)',
-                500: 'rgba(254,0,0,0.5)',
-                600: '#a20606',
-              },
-            },
-          },
-        },
-      },
-
-      plugins: [
-        tailwindcssVariables({
-          colorVariables: true,
-          forceRGB: true,
-        }),
-      ],
-    })
-  ).toMatchInlineSnapshot(`
-    "
-
-      
-      + :root {
-      +   --colors-red-400: 254,0,0;
-      +   --colors-red-500: 254,0,0;
-      +   --colors-red-600: 162,6,6
-      + }
-      + .from-red-400 {
-      +   --tw-gradient-from: rgb(var(--colors-red-400));
-      +   --tw-gradient-to: rgba(var(--colors-red-400), 0);
-      +   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
-      + }
-      + .from-red-500 {
-      +   --tw-gradient-from: rgb(var(--colors-red-500));
-      +   --tw-gradient-to: rgba(var(--colors-red-500), 0);
-      +   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
-      + }
-      + .from-red-600 {
-      +   --tw-gradient-from: rgb(var(--colors-red-600));
-      +   --tw-gradient-to: rgba(var(--colors-red-600), 0);
-      +   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
-      + }
-      + .text-opacity-50 {
-      +   --tw-text-opacity: 0.5
-      + }
-
-    "
-  `)
-})