fix(postcss-linaria): enable CI tests (#1466)

* fix(postcss-linaria): enable CI tests

* chore: add changeset for postcss-linaria fixes

Author: Anber

.changeset/postcss-linaria-tests.md

@@ -0,0 +1,5 @@
+---
+'@linaria/postcss-linaria': patch
+---
+
+Fix `@linaria/postcss-linaria` placeholder naming and source location correction, and ensure stylelint integration resolves configs correctly.

packages/postcss-linaria/__tests__/stylelint.test.ts

@@ -1,3 +1,5 @@
+import { resolve } from 'path';
+
 import stylelint, { type Config } from 'stylelint';
 
 // importing from the package would create circular dependency
@@ -7,6 +9,11 @@ import config from '../../stylelint-config-standard-linaria/src';
 
 // note: need to run pnpm install to pick up updates from any parse/stringify changes
 describe('stylelint', () => {
+  const configBasedir = resolve(
+    __dirname,
+    '../../stylelint-config-standard-linaria'
+  );
+
   it('should not error with valid syntax', async () => {
     const source = `
       css\`
@@ -26,6 +33,7 @@ describe('stylelint', () => {
     const result = await stylelint.lint({
       code: source,
       config: config as Config,
+      configBasedir,
     });
 
     expect(result.errored).toEqual(false);
@@ -46,6 +54,7 @@ describe('stylelint', () => {
         },
       } as Config,
       fix: true,
+      configBasedir,
     });
     expect(result.errored).toEqual(false);
     expect(result.output).toMatchInlineSnapshot(`
@@ -71,6 +80,7 @@ describe('stylelint', () => {
         },
       } as Config,
       fix: true,
+      configBasedir,
     });
     expect(result.errored).toEqual(false);
     expect(result.output).toMatchInlineSnapshot(`
@@ -97,6 +107,7 @@ describe('stylelint', () => {
         },
       } as Config,
       fix: true,
+      configBasedir,
     });
     expect(result.output).toMatchInlineSnapshot(`
       "
@@ -124,6 +135,7 @@ describe('stylelint', () => {
           indentation: 4,
         },
       } as Config,
+      configBasedir,
     });
 
     expect(result.errored).toEqual(false);

packages/postcss-linaria/package.json

@@ -29,6 +29,7 @@
     "build:esm": "babel src --out-dir esm --extensions '.js,.jsx,.ts,.tsx' --source-maps --delete-dir-on-start",
     "build:lib": "cross-env NODE_ENV=legacy babel src --out-dir lib --extensions '.js,.jsx,.ts,.tsx' --source-maps --delete-dir-on-start",
     "typecheck": "tsc --noEmit --composite false",
+    "test": "jest --config ../../jest.config.js --rootDir .",
     "watch": "pnpm build:lib --watch & pnpm build:esm --watch & pnpm build:declarations --watch"
   },
   "dependencies": {

packages/postcss-linaria/src/locationCorrection.ts

@@ -9,7 +9,8 @@ const correctLocation = (
   loc: Position,
   baseIndentations: Map<number, number>,
   sourceAsString: string,
-  prefixOffsets?: { lines: number; offset: number }
+  prefixOffsets?: { lines: number; offset: number },
+  kind: 'start' | 'end' = 'start'
 ): Position => {
   if (!node.quasi.loc || !node.quasi.range) {
     return loc;
@@ -19,7 +20,7 @@ const correctLocation = (
   const nodeLoc = node.quasi.loc;
   const nodeOffset = node.quasi.range[0];
   let lineOffset = nodeLoc.start.line - 1;
-  let newOffset = loc.offset + nodeOffset + 1;
+  let newOffset = loc.offset + nodeOffset + (kind === 'start' ? 1 : 0);
   let currentLine = 1;
   let columnOffset = nodeLoc.start.column + 1;
 
@@ -276,7 +277,8 @@ export function locationCorrectionWalker(
         node.source.start,
         baseIndentations,
         sourceAsString,
-        root.raws.linariaPrefixOffsets
+        root.raws.linariaPrefixOffsets,
+        'start'
       );
     }
     if (node.source?.end) {
@@ -285,7 +287,8 @@ export function locationCorrectionWalker(
         node.source.end,
         baseIndentations,
         sourceAsString,
-        root.raws.linariaPrefixOffsets
+        root.raws.linariaPrefixOffsets,
+        'end'
       );
     }
   };

packages/postcss-linaria/src/util.ts

@@ -54,7 +54,7 @@ const isRuleSet = (sourceAsString: string, indexAfterExpression: number) => {
   );
 };
 
-export const placeholderText = 'pcss_lin';
+export const placeholderText = 'pcss-lin';
 
 export const createPlaceholder = (
   i: number,

turbo.json

@@ -24,6 +24,9 @@
     "@linaria/react#test": {
       "dependsOn": ["@linaria/core#build"]
     },
+    "@linaria/postcss-linaria#test": {
+      "dependsOn": ["@linaria/postcss-linaria#build"]
+    },
     "@linaria/testkit#test": {
       "dependsOn": ["^build"]
     },