TypeError: Cannot read property 'message' of undefined

[lgs]

I got annoying TypeError output which is difficult if not impossible to debug. The request is to improve the error messaging so that will be easier to debug.

Here is the error, which is too generic and misleading:

annot read property 'message' of undefined
TypeError: Cannot read property 'message' of undefined
    at __error.svelte:10:96
    at Object.$$render (/home/basenode/Svelte/svelte-kit-boot/node_modules/svelte/internal/index.js:1380:22)
    at Object.default (root.svelte:38:46)
    at eval (/home/basenode/Svelte/svelte-kit-boot/src/routes/__layout.svelte:20:32)
    at Object.$$render (/home/basenode/Svelte/svelte-kit-boot/node_modules/svelte/internal/index.js:1380:22)
    at root.svelte:36:44
    at $$render (/home/basenode/Svelte/svelte-kit-boot/node_modules/svelte/internal/index.js:1380:22)
    at Object.render (/home/basenode/Svelte/svelte-kit-boot/node_modules/svelte/internal/index.js:1388:26)
    at render_response (file:///home/basenode/Svelte/svelte-kit-boot/node_modules/@sveltejs/kit/dist/ssr.js:363:28)
    at async respond_with_error (file:///home/basenode/Svelte/svelte-kit-boot/node_modules/@sveltejs/kit/dist/ssr.js:908:10)
10:32:06 AM [vite] page reload src/routes/account.svelte

and here it is the stack:

{
	"name": "svelte-kit",
	"version": "0.0.1",
	"scripts": {
		"stripe": "cd src/server && npm start",
		"dev": "svelte-kit dev",
		"build": "svelte-kit build",
		"start": "svelte-kit preview"
	},
	"devDependencies": {
		"@sveltejs/adapter-node": "^1.0.0-next.19",
		"@sveltejs/kit": "next",
		"autoprefixer": "^10.2.5",
		"cssnano": "^5.0.2",
		"postcss": "^8.2.14",
		"postcss-load-config": "^3.0.1",
		"svelte": "^3.38.2",
		"svelte-preprocess": "^4.7.3",
		"tailwindcss": "^2.1.2",
		"vite": "^2.2.4"
	},
	"type": "module",
	"engines": {
		"node": ">= 14.16.1"
	},
	"dependencies": {
		"cookie-parser": "^1.4.5",
		"cors": "^2.8.5",
		"dotenv": "^8.6.0",
		"express": "^4.17.1",
		"simple-json-db": "^1.2.3",
		"stripe": "^8.148.0"
	}
}

the offending code should be "potentially" the following:

$ cat ~/src/client/account.js
document.addEventListener('DOMContentLoaded', async () => {
  // Fetch the list of subscriptions for this customer.
  const {subscriptions} = await fetch('/subscriptions').then((r) => r.json());

  // Construct and display each subscription, its status, last4 of the card
  // used, and the current period end.
  const subscriptionsDiv = document.querySelector('#subscriptions');
  subscriptionsDiv.innerHTML = subscriptions.data.map((subscription) => {
    return `
      <hr>
      <h4>
        <a href="https://dashboard.stripe.com/test/subscriptions/${subscription.id}">
          ${subscription.id}
        </a>
      </h4>

      <p>
        Status: ${subscription.status}
      </p>

      <p>
        Card last4: ${subscription.default_payment_method.card.last4}
      </p>

      <p>
        Current period end: ${new Date(subscription.current_period_end * 1000)}
      </p>

      <!--<a href="change-payment-method.html?subscription=${subscription.id}"> Update payment method </a><br />
      <a href="change-plan.html?subscription=${subscription.id}"> Change plan </a><br /> -->
      <a href="cancel.html?subscription=${subscription.id}"> Cancel </a><br />
    `;
  }).join('<br />');
});

[benmccann]

Please fill out the bug template. I cannot tell what version of SvelteKit you're using

This seems like a duplicate of a fixed issue #996