fix: posix paths

.github/workflows/test.yml

@@ -11,13 +11,11 @@ on:
 
 jobs:
   build:
-
-    runs-on: ubuntu-latest
-
     strategy:
       matrix:
+        os: [ubuntu-latest, windows-latest]
         node-version: [20.x]
-
+    runs-on: ${{ matrix.os }}
     steps:
     - uses: actions/checkout@v3
     - name: Use Node.js ${{ matrix.node-version }}
@@ -30,4 +28,4 @@ jobs:
     - run: npm run build
     - run: npm run check
     - run: npx playwright install
-    - run: npm test
+    - run: npm test

packages/process/src/processor.ts

@@ -27,13 +27,17 @@ const processor = ({
             /**
              * Only use on specific extensions
              */
-            if (!extensions.find((extension) => filename?.endsWith(extension)))
+            if (
+                !filename ||
+                !extensions.find((extension) => filename?.endsWith(extension))
+            )
                 return;
 
             /**
              * Add svelte components to be used with markdoc tags
              */
             const code = transformer({
+                filename,
                 config,
                 content,
                 layouts,

packages/process/src/transformer.ts

@@ -16,11 +16,17 @@ import {
     getNameOfDeclaration,
     isVariableStatement,
 } from 'typescript';
-import { dirname, join } from 'path';
+import { dirname, join, relative } from 'path';
 import { load as loadYaml } from 'js-yaml';
 import { parse as svelteParse, walk } from 'svelte/compiler';
 import { render_html } from './renderer';
-import { get_all_files, path_exists, read_file, write_to_file } from './utils';
+import {
+    get_all_files,
+    path_exists,
+    read_file,
+    relative_posix_path,
+    write_to_file,
+} from './utils';
 import * as default_schema from './default_schema';
 import type { Config } from './config';
 
@@ -31,6 +37,7 @@ type Var = {
 
 export function transformer({
     content,
+    filename,
     nodes_file,
     tags_file,
     partials_dir,
@@ -39,6 +46,7 @@ export function transformer({
     config,
 }: {
     content: string;
+    filename: string;
     nodes_file: Config['nodes'];
     tags_file: Config['tags'];
     partials_dir: Config['partials'];
@@ -66,7 +74,6 @@ export function transformer({
         ? layouts[frontmatter?.layout ?? 'default'] ?? undefined
         : undefined;
     const has_layout = selected_layout !== undefined;
-
     /**
      * add used svelte components to the script tag
      */
@@ -80,22 +87,31 @@ export function transformer({
     /**
      * add import for tags
      */
-    if (has_tags) {
-        dependencies += `import * as INTERNAL__TAGS from '${tags_file}';`;
+    if (tags_file && has_tags) {
+        dependencies += `import * as INTERNAL__TAGS from '${relative_posix_path(
+            filename,
+            tags_file,
+        )}';`;
     }
 
     /**
      * add import for nodes
      */
-    if (has_nodes) {
-        dependencies += `import * as INTERNAL__NODES from '${nodes_file}';`;
+    if (nodes_file && has_nodes) {
+        dependencies += `import * as INTERNAL__NODES from '${relative_posix_path(
+            filename,
+            nodes_file,
+        )}';`;
     }
 
     /**
      * add import for layout
      */
-    if (has_layout) {
-        dependencies += `import INTERNAL__LAYOUT from '${selected_layout}';`;
+    if (selected_layout && has_layout) {
+        dependencies += `import INTERNAL__LAYOUT from '${relative_posix_path(
+            filename,
+            selected_layout,
+        )}';`;
     }
 
     if (generate_schema) {

packages/process/src/utils.ts

@@ -5,7 +5,8 @@ import {
     readdirSync,
     writeFileSync,
 } from 'fs';
-import { join } from 'path';
+import { dirname, join, relative, sep } from 'path';
+import { sep as posix_sep } from 'path/posix';
 
 export function get_all_files(path: string): string[] {
     const files = [];
@@ -29,3 +30,7 @@ export function write_to_file(file: string, content: string): void {
 export function path_exists(path: string): boolean {
     return existsSync(path);
 }
+
+export function relative_posix_path(from: string, to: string): string {
+    return relative(dirname(from), to).split(sep).join(posix_sep);
+}

packages/process/tests/processor.test.mjs

@@ -3,7 +3,7 @@ import assert from 'node:assert/strict';
 import { test } from 'node:test';
 import { basename, dirname, join } from 'node:path';
 import { markdoc } from '../dist/module.js';
-import { absoulute, read_file } from './utils.mjs';
+import { absoulute, read_file, relative_posix_path } from './utils.mjs';
 import { fileURLToPath } from 'node:url';
 
 test('preprocessor', async (context) => {
@@ -63,7 +63,7 @@ test('preprocessor', async (context) => {
     const stream = fg.globStream(absoulute(import.meta.url, './processor/**'), {
         onlyDirectories: true,
     });
-    const current_dir = dirname(fileURLToPath(import.meta.url));
+
     for await (const entry of stream) {
         await context.test('tests ' + basename(entry), async () => {
             const before = await read_file(join(entry, 'source.markdoc'));
@@ -75,10 +75,7 @@ test('preprocessor', async (context) => {
                 content: before,
                 filename: 'test.markdoc',
             });
-            assert.equal(
-                markup.code,
-                after.replaceAll('__PATH__', current_dir),
-            );
+            assert.equal(markup.code, after);
         });
     }
 });

packages/process/tests/processor/layout - default/compiled.txt

@@ -1 +1 @@
-<script>import INTERNAL__LAYOUT from '__PATH__/layouts/default.svelte';</script><INTERNAL__LAYOUT><article><h1>Hello World</h1></article></INTERNAL__LAYOUT>
+<script>import INTERNAL__LAYOUT from 'tests/layouts/default.svelte';</script><INTERNAL__LAYOUT><article><h1>Hello World</h1></article></INTERNAL__LAYOUT>

packages/process/tests/processor/layout - named/compiled.txt

@@ -1 +1 @@
-<script context="module">export const frontmatter = {"layout":"named"};</script><script>import INTERNAL__LAYOUT from '__PATH__/layouts/named.svelte';</script><INTERNAL__LAYOUT {...frontmatter}><article><h1>Hello World</h1></article></INTERNAL__LAYOUT>
+<script context="module">export const frontmatter = {"layout":"named"};</script><script>import INTERNAL__LAYOUT from 'tests/layouts/named.svelte';</script><INTERNAL__LAYOUT {...frontmatter}><article><h1>Hello World</h1></article></INTERNAL__LAYOUT>

packages/process/tests/processor/nodes, tags and partials/compiled.txt

@@ -1 +1 @@
-<script>import * as INTERNAL__TAGS from '__PATH__/tags/module.svelte';import * as INTERNAL__NODES from '__PATH__/nodes/module.svelte';</script><article><INTERNAL__NODES.Heading level={1}>Heading 1</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={2}>Heading 2</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading id="my-id" level={1}>With ID </INTERNAL__NODES.Heading><INTERNAL__NODES.Heading class="my-class" level={1}>With Class</INTERNAL__NODES.Heading><INTERNAL__TAGS.Hello></INTERNAL__TAGS.Hello><p><INTERNAL__TAGS.Slot>slot content</INTERNAL__TAGS.Slot></p><INTERNAL__NODES.Heading level={1}>I am a partial</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={1}>Lorem Ipsum</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={1}>I am nested</INTERNAL__NODES.Heading></article>
+<script>import * as INTERNAL__TAGS from 'tests/tags/module.svelte';import * as INTERNAL__NODES from 'tests/nodes/module.svelte';</script><article><INTERNAL__NODES.Heading level={1}>Heading 1</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={2}>Heading 2</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading id="my-id" level={1}>With ID </INTERNAL__NODES.Heading><INTERNAL__NODES.Heading class="my-class" level={1}>With Class</INTERNAL__NODES.Heading><INTERNAL__TAGS.Hello></INTERNAL__TAGS.Hello><p><INTERNAL__TAGS.Slot>slot content</INTERNAL__TAGS.Slot></p><INTERNAL__NODES.Heading level={1}>I am a partial</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={1}>Lorem Ipsum</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={1}>I am nested</INTERNAL__NODES.Heading></article>

packages/process/tests/processor/nodes/compiled.txt

@@ -1 +1 @@
-<script>import * as INTERNAL__NODES from '__PATH__/nodes/module.svelte';</script><article><INTERNAL__NODES.Heading level={1}>Heading 1</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={2}>Heading 2</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading id="my-id" level={1}>With ID </INTERNAL__NODES.Heading><INTERNAL__NODES.Heading class="my-class" level={1}>With Class</INTERNAL__NODES.Heading></article>
+<script>import * as INTERNAL__NODES from 'tests/nodes/module.svelte';</script><article><INTERNAL__NODES.Heading level={1}>Heading 1</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading level={2}>Heading 2</INTERNAL__NODES.Heading><INTERNAL__NODES.Heading id="my-id" level={1}>With ID </INTERNAL__NODES.Heading><INTERNAL__NODES.Heading class="my-class" level={1}>With Class</INTERNAL__NODES.Heading></article>

packages/process/tests/processor/tags/compiled.txt

@@ -1 +1 @@
-<script>import * as INTERNAL__TAGS from '__PATH__/tags/module.svelte';</script><article><INTERNAL__TAGS.Hello></INTERNAL__TAGS.Hello><p><INTERNAL__TAGS.Slot>slot content</INTERNAL__TAGS.Slot></p></article>
+<script>import * as INTERNAL__TAGS from 'tests/tags/module.svelte';</script><article><INTERNAL__TAGS.Hello></INTERNAL__TAGS.Hello><p><INTERNAL__TAGS.Slot>slot content</INTERNAL__TAGS.Slot></p></article>

packages/process/tests/utils.mjs

@@ -1,6 +1,7 @@
 import { readFile } from 'fs/promises';
 import { dirname, join } from 'path';
 import { fileURLToPath } from 'url';
+export { relative_posix_path } from '../dist/utils.js';
 
 export function absoulute(current, file) {
     return join(dirname(fileURLToPath(current)), file);