Sveltekit broken on iOS 13: [Error] SyntaxError: Unexpected token '.' promiseReactionJob

Describe the bug

Running a Svelte Kit project on an iPhone running iOS13, as soon as the page loads and error appears on the console and JS execution is interrupted:

[Error] SyntaxError: Unexpected token '.'
	promiseReactionJob

Reproduction

On a brand new install of svelte kit with npm init svelte
Happens on both skeleton and demo app equally
No type checking, linting, formatting or browser test added
Run (localhost:3000)
Open on iPhone with iOS 13 (try with iPhone Simulator)

Expected: App runs normally, no errors.

What actually happens: Error on console. And Javascript execution is interrupted, no JS runs so app is unresponsive.

Logs

Browser console:

[Error] SyntaxError: Unexpected token '.'
	promiseReactionJob

Server console: Nothing…

$ npm run dev

> test2@0.0.1 prepare
> svelte-kit sync


up to date, audited 168 packages in 1s

10 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

> test2@0.0.1 dev
> svelte-kit dev


  SvelteKit v1.0.0-next.350

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

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

System Info

System:
    OS: macOS 12.4
    CPU: (8) x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
    Memory: 23.48 MB / 16.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 16.15.0 - /usr/local/bin/node
    Yarn: 1.22.5 - /usr/local/bin/yarn
    npm: 8.5.5 - /usr/local/bin/npm
  npmPackages:
    @sveltejs/adapter-auto: next => 1.0.0-next.50 
    @sveltejs/kit: next => 1.0.0-next.350 
    svelte: ^3.46.0 => 3.48.0

Severity

blocking all usage of SvelteKit

Additional Information

It was reported to me that a sveltekit app wasn’t working on iOS 13. The only way I was able to test was through iOS simulator as I don’t have such a device. As seen this is a breaking bug on simulator on a blank app install my assumption is it’s the same cause of the bug on the actual iOS 13 device the person reported the app not working.

Issue Analytics

State:
Created a year ago
Reactions:2
Comments:7 (5 by maintainers)

Top GitHub Comments

2reactions

jacob-8commented, Jun 25, 2022

Vite (and esbuild) can handle it by setting build.target to something lower

I believe Vite supports iOS 11+

To elaborate for those like me who need it, here is how you can enable the use of optional chaining (and other new javascript syntax features) in SvelteKit and maintain compatibility for all browsers that can run ES2015 (or your desired target):

First it’s helpful to learn at which build target your desired syntax features esbuild will transpile backwards by reading https://esbuild.github.io/content-types/#javascript linked to from Vite’s buildtarget docs @benmccann referenced.
Set a build target in your svelte.config.js file according to your needs. I chose to set kit.vite.build.target to 'es2015' and can confirm that this affects both compiled .svelte and .js files