Compatibility Issues with Svelte 5 Runes Mode in Framework7 Svelte

Abierto

#4,298 abierto el 16/12/2024 1 comentario 7 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad: 4/5
Tiempo estimado: 3-5 días
Aptitud para principiantes: 45/100

Tipo de issue: Error
Claridad: Bastante claro
Estado de actividad: Tranquilo
Stack tecnológico: javascript
Área: frontend, mobile

Línea de trabajo

Comienza con el diagnóstico del compilador de Svelte 5 en components/list-item.svelte, en la línea 103, y luego compara las declaraciones reactivas relacionadas en list-input.svelte, accordion-content.svelte, accordion-toggle.svelte y accordion.svelte. Reproduce el problema usando framework7-svelte 8.3.4 con Svelte 5.1.6 y verifica que los errores de compatibilidad reportados ya no se produzcan sin degradar Svelte.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

I am experiencing compatibility issues with Svelte 5 Runes Mode in Framework7 Svelte. Specifically, reactive expressions in Framework7 component files throw the following error:

[svelte] reactive_declaration_non_reactive_property
A $: statement (node_modules/framework7-svelte/components/list-item.svelte:103:2) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode

For example, in list-item.svelte, this line throws the error:
$: liClasses = classNames( className, { 'list-group-title': groupTitle, 'media-item': isMedia, swipeout, 'accordion-item': accordionItem, 'accordion-item-opened': accordionItemOpened, disabled: disabled && !(radio || checkbox), 'no-chevron': noChevron, 'chevron-center': chevronCenter, 'disallow-sorting': sortable === false, }, colorClasses($$props), );

I am also experiencing this issue in the following files:

node_modules/framework7-svelte/components/list-input.svelte:197:2
node_modules/framework7-svelte/components/accordion-content.svelte:9:2
node_modules/framework7-svelte/components/accordion-toggle.svelte:9:2
node_modules/framework7-svelte/components/accordion.svelte:11:2

I am using the latest versions of both Svelte and Framework7. This issue did not occur before updating to Svelte 5. Are there plans to update Framework7 Svelte for Svelte 5 compatibility? How can I resolve this issue without downgrading Svelte?

Versions:
"framework7": "^8.3.4",
"framework7-svelte": "^8.3.4",
"svelte": "^5.1.6"

Thank you