Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

img with loading attribute will lead to "read properties of undefined (reading 'loading')" #14235

Closed
Mingx94 opened this issue Nov 9, 2024 · 1 comment · Fixed by #14237
Closed

img with loading attribute will lead to "read properties of undefined (reading 'loading')" #14235

Mingx94 opened this issue Nov 9, 2024 · 1 comment · Fixed by #14237

Comments

@Mingx94
Copy link

Mingx94 commented Nov 9, 2024

Describe the bug

When navigate to a page that has img element with loading attribute, the page crashed and showing "read properties of undefined (reading 'loading')" in console.

Reproduction

https://svelte.dev/playground/fd9fd756b9c942f18f5c9364a8c46454?version=5.1.13

Logs

Uncaught TypeError: Cannot read properties of undefined (reading 'loading')

	in +layout.svelte
	in root.svelte

    at Module.handle_lazy_img (chunk-5S7XBGTN.js?v=925f45c9:1586:30)
    at _page (+page.svelte:34:23)
    at chunk-5S7XBGTN.js?v=925f45c9:222:58
    at update_reaction (chunk-GFV2NITQ.js?v=925f45c9:889:23)
    at update_effect (chunk-GFV2NITQ.js?v=925f45c9:980:21)
    at create_effect (chunk-GFV2NITQ.js?v=925f45c9:1992:7)
    at branch (chunk-GFV2NITQ.js?v=925f45c9:2124:10)
    at chunk-5S7XBGTN.js?v=925f45c9:216:17
    at update_reaction (chunk-GFV2NITQ.js?v=925f45c9:889:23)
    at update_effect (:5173/node_modules/.vite/deps/chunk-GFV2NITQ.js?v=925f45c9:980:21)TypeError: Cannot read properties of undefined (reading 'loading')
    at Module.handle_lazy_img (chunk-5S7XBGTN.js?v=925f45c9:1586:30)
    at _page (+page.svelte:34:23)
    at chunk-5S7XBGTN.js?v=925f45c9:222:58
    at update_reaction (chunk-GFV2NITQ.js?v=925f45c9:889:23)
    at update_effect (chunk-GFV2NITQ.js?v=925f45c9:980:21)
    at create_effect (chunk-GFV2NITQ.js?v=925f45c9:1992:7)
    at branch (chunk-GFV2NITQ.js?v=925f45c9:2124:10)
    at chunk-5S7XBGTN.js?v=925f45c9:216:17
    at update_reaction (chunk-GFV2NITQ.js?v=925f45c9:889:23)
    at update_effect (chunk-GFV2NITQ.js?v=925f45c9:980:21)

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (12) x64 12th Gen Intel(R) Core(TM) i5-12400
    Memory: 13.51 GB / 31.85 GB
  Binaries:
    Node: 20.18.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.22 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 10.9.0 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.12.3 - ~\AppData\Roaming\npm\pnpm.CMD
  Browsers:
    Edge: Chromium (127.0.2651.74)
    Internet Explorer: 11.0.22621.3527
  npmPackages:
    svelte: ^5.1.9 => 5.1.9

Severity

annoyance
@brunnerh
Copy link
Member

brunnerh commented Nov 9, 2024 •
edited
Loading

If there is just the image, it works; the generated code passes the element correctly:

var img = root();

$.handle_lazy_img(img);

With an additional element, no variable for the image is generated and the call becomes empty 🤔

var fragment = root();

$.next(2);
$.handle_lazy_img();

I guess a check is missing to get an element reference in case there isn't one yet. E.g. passing in a src attribute from code or binding the image element will also make it work, so it just breaks in the completely static case since nothing else generates the variable.

@paoloricciuti paoloricciuti mentioned this issue Nov 9, 2024
Merged
5 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix: consider img with loading attribute not static sveltejs/svelte
2 participants
@brunnerh @Mingx94