sveltejs / kit

web development, streamlined
https://svelte.dev/docs/kit
MIT License
18.71k stars 1.94k forks source link

Weird when declaring on:change before bind:checked #8744

Closed sdekna closed 1 year ago

sdekna commented 1 year ago

Describe the bug

if I declare on:change before bind:checked={$variable} and in the on:change function log out the value of the $variable, it logs out the previous state rather than the newly changed state, as if it is executing the on:change function before actually changing the variable state.

Reproduction

https://svelte.dev/repl/a8c751e708834314b4a4af51d3d16870?version=3.55.1

Logs

No response

System Info

System:
    OS: Linux 5.15 elementary OS 6.1 Jólnir
    CPU: (4) x64 Intel(R) Core(TM) m7-6Y75 CPU @ 1.20GHz
    Memory: 1.36 GB / 7.65 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 16.19.0 - /usr/bin/node
    Yarn: 1.22.19 - ~/node_modules/.bin/yarn
    npm: 8.19.3 - /usr/bin/npm
  Browsers:
    Chrome: 109.0.5414.74
  npmPackages:
    @formkit/auto-animate: ^1.0.0-beta.5 => 1.0.0-beta.5 
    @lottiefiles/svelte-lottie-player: ^0.3.0 => 0.3.0 
    @macfja/svelte-persistent-store: ^2.2.1 => 2.2.1 
    @nhost/nhost-js: ^1.7.0 => 1.7.0 
    @playwright/test: 1.28.1 => 1.28.1 
    @popperjs/core: ^2.11.6 => 2.11.6 
    @sveltejs/adapter-auto: 1.0.0 => 1.0.0 
    @sveltejs/adapter-static: ^1.0.0 => 1.0.0 
    @sveltejs/kit: ^1.0.0 => 1.0.0 
    @urql/svelte: ^3.0.3 => 3.0.3 
    animejs: ^3.2.1 => 3.2.1 
    autoprefixer: ^10.4.13 => 10.4.13 
    cesium: ^1.100.0 => 1.100.0 
    classnames: ^2.3.2 => 2.3.2 
    daisyui: ^2.45.0 => 2.45.0 
    dialog-polyfill: ^0.5.6 => 0.5.6 
    eslint: ^8.29.0 => 8.29.0 
    eslint-config-prettier: ^8.5.0 => 8.5.0 
    eslint-plugin-svelte3: ^4.0.0 => 4.0.0 
    flowbite: ^1.5.5 => 1.5.5 
    flowbite-svelte: ^0.28.11 => 0.28.11 
    graphql: ^15.8.0 => 15.8.0 
    graphql-ws: ^5.11.2 => 5.11.2 
    houdini: ^0.19.2 => 0.19.2 
    houdini-svelte: ^0.19.2 => 0.19.2 
    leaflet: ^1.9.3 => 1.9.3 
    lottie-svelte: ^1.3.3 => 1.3.3 
    polyline-encoded: ^0.0.9 => 0.0.9 
    postcss: ^8.4.20 => 8.4.20 
    prettier: ^2.8.1 => 2.8.1 
    prettier-plugin-svelte: ^2.9.0 => 2.9.0 
    svelte: ^3.55.0 => 3.55.0 
    svelte-check: ^2.10.2 => 2.10.2 
    svelte-chota: ^1.8.6 => 1.8.6 
    svelte-drawer-component: ^1.2.2 => 1.2.2 
    svelte-french-toast: ^1.0.3 => 1.0.3 
    svelte-particles: ^2.7.0 => 2.7.0 
    svelte-preprocess: ^5.0.0 => 5.0.0 
    svelte-qrcode: ^1.0.0 => 1.0.0 
    svelte-range-slider-pips: ^2.1.1 => 2.1.1 
    tailwindcss: ^3.2.4 => 3.2.4 
    tsparticles: ^2.7.0 => 2.7.0 
    tsparticles-engine: ^2.7.0 => 2.7.0 
    tsparticles-preset-fireworks: ^2.7.0 => 2.7.0 
    typescript: ^4.9.4 => 4.9.4 
    vite: ^4.0.1 => 4.0.1

Severity

serious, but I can work around it

Additional Information

No response

Conduitry commented 1 year ago

This is the intended behavior, and is documented in https://svelte.dev/docs#template-syntax-element-directives-bind-property (https://github.com/sveltejs/svelte/pull/6887)