Skip to content

Loss of reactivity upon assignment in the condition #3512

@PieceOfGood

Description

@PieceOfGood

To Reproduce

<script>
    let toggle = false;

    function _toggleMe() {
        if (toggle = !toggle) {
            console.log(toggle);
        } else {
            console.log(toggle);
        }
    }
</script>

<button on:click={_toggleMe}>Click</button>
<span class="text {toggle ? "red" : "blue"}">
    text
</span>

Describe the bug
If assign value to toggle in the condition, toggle classes happens only once.

Expected behavior
But, if assignment take out to before the compare, it worked, as it should:

<script>
    let toggle = false;

    function _toggleMe() {
        toggle = !toggle;
        if (toggle) {
            console.log(toggle);
        } else {
            console.log(toggle);
        }
    }
</script>

<button on:click={_toggleMe}>Click</button>
<span class="text {toggle ? "red" : "blue"}">
    text
</span>

Information about your Svelte project:

  • Chrome 76

  • OS Windows 10

  • Svelte version 3.9.2

  • Rollup

Severity
Simple problem. Doesn't affect something important.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions