[Bug?]: project directory containing en dash character breaks SolidStart actions

[ArturJD96]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

When project is inside a directory containing "en dash" character in the name, the requests sent from component cannot reach dev server.

The error messages are not clear enough that it is a thing outside the project that breaks Solid Start.

Safari:

[Error] Unhandled Promise Rejection: TypeError: Type error

Firefox:

Uncaught (in promise) TypeError: Window.fetch: Cannot convert value in record<ByteString, ByteString> branch of (sequence<sequence<ByteString>> or record<ByteString, ByteString>) to ByteString because the character at index 79 has value 8211 which is greater than 255.
    createRequest server-runtime.js:97
    fetchServerFunction server-runtime.js:122
    fn server-runtime.js:178
    mutate action.js:43
    useAction action.js:35
    click Counter.tsx:20
    handleNode dev.js:501
    eventHandler dev.js:522

Expected behavior 🤔

The error should explicitly inform the cause:

Invalid path: /your...project...path.../problematic\ –\ directory/BugReport/src/components/Counter.tsx
The character at index 79 has value 8211 which is greater than 255.

(paraphrasing Firefox's error message)

Steps to reproduce 🕹

Steps:

1. Create new project with a directory path containing en dash:

mkdir problematic\ –\ directory
cd problematic\ –\ directory
pnpm create solid

2. Init your project with setup wizard (I used SolidStart with "basic" template and named it "BugReport").
3. Update to the latest version and init:

cd BugReport
pnpm install
pnpm update --latest

4. Check at problematic\ –\ directory/BugReport/package.json if SolidStart is up to date (for me 1.2.0)
5. Add action to the component from the template (Counter) at problematic\ –\ directory/BugReport/src/components/Counter.tsx:`

import { createSignal } from "solid-js";
import "./Counter.css";

import { action, useAction } from "@solidjs/router";

const test = action(async () => {
  "use server";
  console.log(process.cwd());
  return "test";
}, "test-action");

export default function Counter() {
  const [count, setCount] = createSignal(0);
  const testMe = useAction(test);

  testMe(); // this will already throw at init

  const click = () => {
    setCount(count() + 1);
    testMe(); // this will throw when button is pressed.
  };

  return (
    <button class="increment" onClick={click} type="button">
      Clicks: {count()}
    </button>
  );
}

6. Run and test in the browser

pnpm run dev

7. Open console in your browser – the error message should appear.

Context 🔦

Took me 3 days to discover it... It boils down to unsafe directory names. Yet, sanitising project path before fetching (or throwing appropriate error message) would be very beneficial.

Thank you for all your great work, I am very happy and enjoy to work with your product and Solid workflow! Greetings 🤗

Your environment 🌎

## System:
 - OS: macOS 13.4
 - CPU: (12) arm64 Apple M2 Pro
 - Memory: 190.38 MB / 32.00 GB
 - Shell: 5.9 - /bin/zsh
## Binaries:
 - Node: 24.7.0 - /usr/local/bin/node
 - Yarn: 1.22.22 - /opt/homebrew/bin/yarn
 - npm: 11.5.1 - /usr/local/bin/npm
 - pnpm: 10.20.0 - /Users/arturdobija/Library/pnpm/pnpm
## npmPackages:
 - @solidjs/meta: ^0.29.4 => 0.29.4 
 - @solidjs/router: ^0.15.3 => 0.15.3 
 - @solidjs/start: ^1.2.0 => 1.2.0 
 - solid-js: ^1.9.10 => 1.9.10 
 - vinxi: ^0.5.8 => 0.5.8