When switching route on macOS (and possibly also iOS) Safari, the error "TypeError: bu.unmask is not a function" occurs, killing the vite server.

Describe the bug

In macOS Safari, when switching route (i.e. by clicking a link such <a sveltekit:prefetch="" href="/nouns-1-mora" class="s-Xvih31qJPb_c">1-mora nouns</a>, or by updating the URL bar manually), the error TypeError: bu.unmask is not a function appears, killing the dev server. The full error log is provided at the bottom of the issue.

As well as macOS Safari, the issue also appears to occur on iOS Safari, as seen by this duplicate issue that was closed due to lack of information: https://github.com/vitejs/vite/issues/3850. Of great note, it does not occur on macOS Firefox nor macOS Chrome on my system, so it seems to be a Safari-specific issue regarding missing functionality. Perhaps this unmask function does not exist on the buffer instance in Safari.

Curiously, however, whichever route is first loaded from the dev server will succeed; it's just that subsequent changes in route will not. So, just after starting the dev server, I could navigate to http://localhost:3000/nouns-1-mora just fine – but clicking links to navigate to another page like / would fail.

Reproduction

The repo https://github.com/shirakaba/jp-pitch-accent exhibits the issue. It was created using the SvelteKit CLI command npm init svelte@next jp-pitch-accent, and the changes relative to the starter template are minimal. To reproduce the issue, first clone the repo and get the Vite server running:

Setting up the repro

git clone git@github.com:shirakaba/jp-pitch-accent.git
cd jp-pitch-accent
npm install
npm run dev

Reproducing the error

Now visit http://localhost:3000 in macOS Safari. Click one of the links along the header (excluding the Twitter and GitHub links, which aren't locally served sites), such as "2-mora nouns" and you should see a view like below:

Note how, following the navigation action, the console now shows messages indicating failure to connect to the Vite server, and the GitHub and Twitter icons have become missing images. If you now view your Vite server, you will see that it has thrown an error and has exited prematurely.

System Info

Note that I am using the macOS Monterey beta. I can't recall whether or not I was experiencing the issue back on Catalina.

  System:
    OS: macOS 12.0
    CPU: (8) x64 Intel(R) Core(TM) i7-6920HQ CPU @ 2.90GHz
    Memory: 37.80 MB / 16.00 GB
    Shell: 4.4.23 - /usr/local/bin/bash
  Binaries:
    Node: 16.1.0 - ~/.nvm/versions/node/v16.1.0/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.7 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Browsers:
    Chrome: 91.0.4472.114
    Safari: 15.0
    Safari Technology Preview: 14.2

Used package manager: npm

Logs

I apologise that I don't quite know how svelte-kit drives vite so I can't turn on the --debug flag, but here are the debug logs I have access to:

Jamies-Macbook-Pro:jp-pitch-accent-kit jamie$ npm run dev

> jp-pitch-accent@0.0.1 dev /Users/jamie/Documents/git/jp-pitch-accent-kit
> svelte-kit dev

  SvelteKit v1.0.0-next.115

  local:   http://localhost:3000
  network: not exposed

  Use --host to expose server to other devices on this network

/Users/jamie/Documents/git/jp-pitch-accent-kit/node_modules/vite/dist/node/chunks/dep-bc228bbb.js:52132
      else bu.unmask(buffer, mask);
              ^

TypeError: bu.unmask is not a function
    at unmask (/Users/jamie/Documents/git/jp-pitch-accent-kit/node_modules/vite/dist/node/chunks/dep-bc228bbb.js:52132:15)
    at Receiver$1.getData (/Users/jamie/Documents/git/jp-pitch-accent-kit/node_modules/vite/dist/node/chunks/dep-bc228bbb.js:53170:25)
    at Receiver$1.startLoop (/Users/jamie/Documents/git/jp-pitch-accent-kit/node_modules/vite/dist/node/chunks/dep-bc228bbb.js:52966:22)
    at Receiver$1._write (/Users/jamie/Documents/git/jp-pitch-accent-kit/node_modules/vite/dist/node/chunks/dep-bc228bbb.js:52901:10)
    at writeOrBuffer (node:internal/streams/writable:389:12)
    at _write (node:internal/streams/writable:330:10)
    at Receiver$1.Writable.write (node:internal/streams/writable:334:10)
    at Socket.socketOnData (/Users/jamie/Documents/git/jp-pitch-accent-kit/node_modules/vite/dist/node/chunks/dep-bc228bbb.js:55047:37)
    at Socket.emit (node:events:365:28)
    at Socket.emit (node:domain:470:12)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! jp-pitch-accent@0.0.1 dev: `svelte-kit dev`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the jp-pitch-accent@0.0.1 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/jamie/.npm/_logs/2021-06-26T15_39_59_645Z-debug.log

Before submitting the issue, please make sure you do the following

[x] Read the Contributing Guidelines.
[x] Read the docs.
[x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[x] Provide a description in this issue that describes the bug.
[x] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
[x] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.

vitejs / vite