Skip to content

False positive in no-immutable-reactive-statements #484

@marekdedic

Description

@marekdedic

Before You File a Bug Report Please Confirm You Have Done The Following...

  • I have tried restarting my IDE and the issue persists.
  • I have updated to the latest version of the packages.

What version of ESLint are you using?

8.40.0

What version of eslint-plugin-svelte are you using?

2.28.0

What did you do?

I am implementing a setup for loading images in pages (i.e. something like calling an API endpoint to get the first 15 images, then loading the next 15 for the next page and so on...). To do this, I am using 4 variables in this way:

<script>
  /* eslint svelte/no-immutable-reactive-statements: "error" */

  let page = 1;
  const perPage = 15;
  $: pageStart = perPage * (page - 1);
  $: pageEnd = pageStart + perPage;

  $: imagesOnThisPage = images.slice(pageStart, pageEnd);
</script>

{#each imagesOnThisPage as image}
 ... show the image
{/each}

<div
  on:click={() => {
    page += 1;
  }}
>
  Next page
</div>

What did you expect to happen?

I expected no issue, as both pageStart and pageEnd need to be reactive, otherwise paging won't work.

What actually happened?

I got svelte/no-immutable-reactive-statements error for pageStart (and also pageEnd if I make pageStart non-reactive)

Link to GitHub Repo with Minimal Reproducible Example

I think the example should be a repro as it is, let me know if it isn't :)

Additional comments

No response

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