Merge branch 'main' into defer-effects-in-pending-boundary

Author: Rich-Harris

.changeset/mighty-mice-call.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: keep batches alive until all async work is complete

.changeset/short-banks-yell.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't preserve reactivity context across function boundaries

.changeset/silly-penguins-sleep.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: make `$inspect` logs come from the callsite

.changeset/witty-seas-learn.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure guards (eg. if, each, key) run before their contents

.github/workflows/ecosystem-ci-trigger.yml

@@ -4,19 +4,20 @@ on:
   issue_comment:
     types: [created]
 
+permissions: {}
+
 jobs:
   trigger:
     runs-on: ubuntu-latest
     if: github.repository == 'sveltejs/svelte' && github.event.issue.pull_request && startsWith(github.event.comment.body, '/ecosystem-ci run')
     permissions:
-      issues: write # to add / delete reactions
+      issues: write # to add / delete reactions, post comments
       pull-requests: write # to read PR data, and to add labels
       actions: read # to check workflow status
       contents: read # to clone the repo
     steps:
-      - name: monitor action permissions
-      - name: check user authorization # user needs triage permission
-        uses: actions/github-script@v7
+      - name: Check User Permissions
+        uses: actions/github-script@v8
         id: check-permissions
         with:
           script: |
@@ -55,7 +56,7 @@ jobs:
             }
 
       - name: Get PR Data
-        uses: actions/github-script@v7
+        uses: actions/github-script@v8
         id: get-pr-data
         with:
           script: |
@@ -65,6 +66,37 @@ jobs:
               repo: context.repo.repo,
               pull_number: context.issue.number
             })
+
+            const commentCreatedAt = new Date(context.payload.comment.created_at)
+            const commitPushedAt = new Date(pr.head.repo.pushed_at)
+
+            console.log(`Comment created at: ${commentCreatedAt.toISOString()}`)
+            console.log(`PR last pushed at: ${commitPushedAt.toISOString()}`)
+
+            // Check if any commits were pushed after the comment was created
+            if (commitPushedAt > commentCreatedAt) {
+              const errorMsg = [
+                '⚠️ Security warning: PR was updated after the trigger command was posted.',
+                '',
+                `Comment posted at: ${commentCreatedAt.toISOString()}`,
+                `PR last pushed at: ${commitPushedAt.toISOString()}`,
+                '',
+                'This could indicate an attempt to inject code after approval.',
+                'Please review the latest changes and re-run /ecosystem-ci run if they are acceptable.'
+              ].join('\n')
+
+              core.setFailed(errorMsg)
+
+              await github.rest.issues.createComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                issue_number: context.issue.number,
+                body: errorMsg
+              })
+
+              throw new Error('PR was pushed to after comment was created')
+            }
+
             return {
               num: context.issue.number,
               branchName: pr.head.ref,
@@ -83,15 +115,16 @@ jobs:
             svelte-ecosystem-ci
 
       - name: Trigger Downstream Workflow
-        uses: actions/github-script@v7
+        uses: actions/github-script@v8
         id: trigger
         env:
           COMMENT: ${{ github.event.comment.body }}
+          PR_DATA: ${{ steps.get-pr-data.outputs.result }}
         with:
           github-token: ${{ steps.generate-token.outputs.token }}
           script: |
             const comment = process.env.COMMENT.trim()
-            const prData = ${{ steps.get-pr-data.outputs.result }}
+            const prData = JSON.parse(process.env.PR_DATA)
 
             const suite = comment.split('\n')[0].replace(/^\/ecosystem-ci run/, '').trim()
 

.github/workflows/pkg.pr.new.yml

@@ -1,6 +1,8 @@
 name: Publish Any Commit
 on: [push, pull_request]
 
+permissions: {}
+
 jobs:
   build:
     permissions: {}

documentation/docs/01-introduction/02-getting-started.md

@@ -15,11 +15,11 @@ Don't worry if you don't know Svelte yet! You can ignore all the nice features S
 
 ## Alternatives to SvelteKit
 
-You can also use Svelte directly with Vite by running `npm create vite@latest` and selecting the `svelte` option. With this, `npm run build` will generate HTML, JS, and CSS files inside the `dist` directory using [vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte). In most cases, you will probably need to [choose a routing library](faq#Is-there-a-router) as well.
+You can also use Svelte directly with Vite by running `npm create vite@latest` and selecting the `svelte` option. With this, `npm run build` will generate HTML, JS, and CSS files inside the `dist` directory using [vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte). In most cases, you will probably need to [choose a routing library](/packages#routing) as well.
 
 >[!NOTE] Vite is often used in standalone mode to build [single page apps (SPAs)](../kit/glossary#SPA), which you can also [build with SvelteKit](../kit/single-page-apps).
 
-There are also plugins for [Rollup](https://github.com/sveltejs/rollup-plugin-svelte), [Webpack](https://github.com/sveltejs/svelte-loader) [and a few others](https://sveltesociety.dev/packages?category=build-plugins), but we recommend Vite.
+There are also [plugins for other bundlers](/packages#bundler-plugins), but we recommend Vite.
 
 ## Editor tooling
 

documentation/docs/02-runes/02-$state.md

@@ -166,6 +166,21 @@ To take a static snapshot of a deeply reactive `$state` proxy, use `$state.snaps
 
 This is handy when you want to pass some state to an external library or API that doesn't expect a proxy, such as `structuredClone`.
 
+## `$state.eager`
+
+When state changes, it may not be reflected in the UI immediately if it is used by an `await` expression, because [updates are synchronized](await-expressions#Synchronized-updates).
+
+In some cases, you may want to update the UI as soon as the state changes. For example, you might want to update a navigation bar when the user clicks on a link, so that they get visual feedback while waiting for the new page to load. To do this, use `$state.eager(value)`:
+
+```svelte
+<nav>
+	<a href="/" aria-current={$state.eager(pathname) === '/' ? 'page' : null}>home</a>
+	<a href="/about" aria-current={$state.eager(pathname) === '/about' ? 'page' : null}>about</a>
+</nav>
+```
+
+Use this feature sparingly, and only to provide feedback in response to user action — in general, allowing Svelte to coordinate updates will provide a better user experience.
+
 ## Passing state into functions
 
 JavaScript is a _pass-by-value_ language — when you call a function, the arguments are the _values_ rather than the _variables_. In other words:

documentation/docs/02-runes/03-$derived.md

@@ -85,8 +85,9 @@ Derived expressions are recalculated when their dependencies change, but you can
 
 Unlike `$state`, which converts objects and arrays to [deeply reactive proxies]($state#Deep-state), `$derived` values are left as-is. For example, [in a case like this](/playground/untitled#H4sIAAAAAAAAE4VU22rjMBD9lUHd3aaQi9PdstS1A3t5XvpQ2Ic4D7I1iUUV2UjjNMX431eS7TRdSosxgjMzZ45mjt0yzffIYibvy0ojFJWqDKCQVBk2ZVup0LJ43TJ6rn2aBxw-FP2o67k9oCKP5dziW3hRaUJNjoYltjCyplWmM1JIIAn3FlL4ZIkTTtYez6jtj4w8WwyXv9GiIXiQxLVs9pfTMR7EuoSLIuLFbX7Z4930bZo_nBrD1bs834tlfvsBz9_SyX6PZXu9XaL4gOWn4sXjeyzftv4ZWfyxubpzxzg6LfD4MrooxELEosKCUPigQCMPKCZh0OtQE1iSxcsmdHuBvCiHZXALLXiN08EL3RRkaJ_kDVGle0HcSD5TPEeVtj67O4Nrg9aiSNtBY5oODJkrL5QsHtN2cgXp6nSJMWzpWWGasdlsGEMbzi5jPr5KFr0Ep7pdeM2-TCelCddIhDxAobi1jqF3cMaC1RKp64bAW9iFAmXGIHfd4wNXDabtOLN53w8W53VvJoZLh7xk4Rr3CoL-UNoLhWHrT1JQGcM17u96oES5K-kc2XOzkzqGCKL5De79OUTyyrg1zgwXsrEx3ESfx4Bz0M5UjVMHB24mw9SuXtXFoN13fYKOM1tyUT3FbvbWmSWCZX2Er-41u5xPoml45svRahl9Wb9aasbINJixDZwcPTbyTLZSUsAvrg_cPuCR7s782_WU8343Y72Qtlb8OYatwuOQvuN13M_hJKNfxann1v1U_B1KZ_D_mzhzhz24fw85CSz2irtN9w9HshBK7AQAAA==)...
 
-```svelte
-let items = $state([...]);
+```js
+// @errors: 7005
+let items = $state([ /*...*/ ]);
 
 let index = $state(0);
 let selected = $derived(items[index]);

documentation/docs/02-runes/07-$inspect.md

@@ -18,6 +18,8 @@ The `$inspect` rune is roughly equivalent to `console.log`, with the exception t
 <input bind:value={message} />
 ```
 
+On updates, a stack trace will be printed, making it easy to find the origin of a state change (unless you're in the playground, due to technical limitations).
+
 ## $inspect(...).with
 
 `$inspect` returns a property `with`, which you can invoke with a callback, which will then be invoked instead of `console.log`. The first argument to the callback is either `"init"` or `"update"`; subsequent arguments are the values passed to `$inspect` ([demo](/playground/untitled#H4sIAAAAAAAACkVQ24qDMBD9lSEUqlTqPlsj7ON-w7pQG8c2VCchmVSK-O-bKMs-DefKYRYx6BG9qL4XQd2EohKf1opC8Nsm4F84MkbsTXAqMbVXTltuWmp5RAZlAjFIOHjuGLOP_BKVqB00eYuKs82Qn2fNjyxLtcWeyUE2sCRry3qATQIpJRyD7WPVMf9TW-7xFu53dBcoSzAOrsqQNyOe2XUKr0Xi5kcMvdDB2wSYO-I9vKazplV1-T-d6ltgNgSG1KjVUy7ZtmdbdjqtzRcphxMS1-XubOITJtPrQWMvKnYB15_1F7KKadA_AQAA)):
@@ -36,13 +38,6 @@ The `$inspect` rune is roughly equivalent to `console.log`, with the exception t
 <button onclick={() => count++}>Increment</button>
 ```
 
-A convenient way to find the origin of some change is to pass `console.trace` to `with`:
-
-```js
-// @errors: 2304
-$inspect(stuff).with(console.trace);
-```
-
 ## $inspect.trace(...)
 
 This rune, added in 5.14, causes the surrounding function to be _traced_ in development. Any time the function re-runs as part of an [effect]($effect) or a [derived]($derived), information will be printed to the console about which pieces of reactive state caused the effect to fire.