- Notifications
You must be signed in to change notification settings - Fork238
Editing a file removes theselected class from the file in the filetree #169
Description
Describe the problem
When you edit a file in the editor,selected class is removed from the file in the filetree (only happens on first edit).
selected_class_is_removed.2.mov
- Reproduction
- visit a tutorial likehttps://learn.svelte.dev/tutorial/your-first-component
- Edit a file in the editor
This is caused by comparingfile with$selected (i.e., these may refer to different objects with the same contents).
| <divclass="row"class:selected={file===$selected}> |
When you open a tutorial page, deep copy ofstub(file) is created...
learn.svelte.dev/src/routes/tutorial/[slug]/Editor.svelte
Lines 190 to 195 in9c9656b
| /** | |
| *@param{import('$lib/types').FileStub}stub | |
| */ | |
| functioncreate_file(stub) { | |
| // deep-copy stub so we can mutate it and not create a memory leak | |
| stub=JSON.parse(JSON.stringify(stub)); |
...then, if you edit a file,change event will be dispatched, andfile will be updated to deep copy of the one.
learn.svelte.dev/src/routes/tutorial/[slug]/Editor.svelte
Lines 210 to 213 in9c9656b
| if (notify) { | |
| stub.contents= contents; | |
| dispatch('change', stub); | |
| } |
learn.svelte.dev/src/routes/tutorial/[slug]/+page.svelte
Lines 390 to 395 in9c9656b
| <Editor | |
| stubs={$files} | |
| selected={$selected} | |
| read_only={$mobile} | |
| on:change={update_stub} | |
| /> |
learn.svelte.dev/src/routes/tutorial/[slug]/+page.svelte
Lines 196 to 209 in9c9656b
| /** | |
| *@param{CustomEvent<import('$lib/types').FileStub>}event | |
| */ | |
| functionupdate_stub(event) { | |
| conststub=event.detail; | |
| constindex=$files.findIndex((s)=>s.name===stub.name); | |
| $files[index]= stub; | |
| adapter?.update([stub]).then((reload)=> { | |
| if (reload) { | |
| schedule_iframe_reload(); | |
| } | |
| }); | |
| update_complete_states([stub]); | |
| } |
Describe the proposed solution
Comparing with the respectivename property instead.