[PR #20343] [MERGED] fix: prevent TypeError when file.url is undefined in UserMessage #25576

Closed
opened 2026-04-20 06:00:32 -05:00 by GiteaMirror · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/open-webui/open-webui/pull/20343
Author: @silentoplayz
Created: 1/3/2026
Status: Merged
Merged: 1/3/2026
Merged by: @tjbck

Base: devHead: fix/user-message-undefined-file-url


📝 Commits (1)

  • 17c3fac fix: handle undefined file.url in UserMessage to prevent TypeError

📊 Changes

1 file changed (+1 additions, -1 deletions)

View changed files

📝 src/lib/components/chat/Messages/UserMessage.svelte (+1 -1)

📄 Description

Pull Request Checklist

Note to first-time contributors: Please open a discussion post in Discussions to discuss your idea/fix with the community before creating a pull request, and describe your changes before submitting a pull request.

This is to ensure large feature PRs are discussed with the community first, before starting work on it. If the community does not want this feature or it is not relevant for Open WebUI as a project, it can be identified in the discussion before working on the feature and submitting the PR.

Before submitting, make sure you've checked the following:

  • Target branch: Verify that the pull request targets the dev branch.
  • Description: Provide a concise description of the changes made in this pull request down below.
  • Changelog: Ensure a changelog entry following the format of Keep a Changelog is added at the bottom of the PR description.
  • Documentation: If necessary, update relevant documentation Open WebUI Docs like environment variables, the tutorials, or other documentation sources.
  • Dependencies: Are there any new dependencies? Have you updated the dependency versions in the documentation?
  • Testing: Perform manual tests to verify the implemented fix/feature works as intended AND does not break any other functionality.
  • Agentic AI Code: Confirm this Pull Request is not written by any AI Agent or has at least gone through additional human review AND manual testing.
  • Code review: Have you performed a self-review of your code, addressing any coding standard issues and ensuring adherence to the project's coding standards?
  • Title Prefix: To clearly categorize this pull request, prefix the pull request title using one of the following:
    • BREAKING CHANGE: Significant changes that may affect compatibility
    • build: Changes that affect the build system or external dependencies
    • ci: Changes to our continuous integration processes or workflows
    • chore: Refactor, cleanup, or other non-functional code changes
    • docs: Documentation update or addition
    • feat: Introduces a new feature or enhancement to the codebase
    • fix: Bug fix or error correction
    • i18n: Internationalization or localization changes
    • perf: Performance improvement
    • refactor: Code restructuring for better maintainability, readability, or scalability
    • style: Changes that do not affect the meaning of the code (white space, formatting, missing semi-colons, etc.)
    • test: Adding missing tests or correcting existing tests
    • WIP: Work in progress, a temporary label for incomplete or ongoing work

Changelog Entry

Description

This PR fixes a TypeError that occurs when rendering user messages with file attachments where the file.url property is undefined. The error "can't access property 'startsWith', $.get(...).url is undefined" was thrown when the code attempted to call .startsWith() on an undefined URL value.

Root cause:
The code in UserMessage.svelte at line 197 was calling file.url.startsWith() without first checking if file.url exists, causing a crash when messages contained files with missing or undefined URL properties.

Solution:
Added optional chaining (?.) to safely access the url property before calling .startsWith(), allowing the code to gracefully handle undefined values without throwing errors.

Changed

Fixed

  • TypeError in UserMessage component when file.url is undefined
    • Added optional chaining to file.url.startsWith('data') and file.url.startsWith('http') calls
    • Prevents application crash when rendering messages with file attachments that have undefined URLs
    • Error: "Uncaught TypeError: can't access property 'startsWith', $.get(...).url is undefined"

Breaking Changes

  • None - change is backward compatible

Additional Information

Technical Details

Before:

file.url.startsWith('data') || file.url.startsWith('http')

After:

file.url?.startsWith('data') || file.url?.startsWith('http')

The optional chaining operator (?.) ensures that if file.url is undefined or null, the expression returns undefined instead of throwing a TypeError. The ternary operator then falls through to the alternative path, constructing the URL using the API base path.

Error Stack Trace (Fixed)

Uncaught TypeError: can't access property "startsWith", $.get(...).url is undefined

  in <unknown>
  in UserMessage.svelte
  in Message.svelte
  in Messages.svelte
  in pane.svelte
  in pane-group.svelte
  in Chat.svelte
  in +page.svelte
  in +layout.svelte
  in +layout.svelte
  in root.svelte
    fileUrl UserMessage.svelte:602
    untrack runtime.js:747
    fileUrl UserMessage.svelte:602
    update_reaction runtime.js:297
    execute_derived deriveds.js:332
    update_derived deriveds.js:356
    get runtime.js:684
    consequent_7 UserMessage.svelte:609
    e each.js:672
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    create_item each.js:672
    reconcile each.js:434
    commit each.js:163
    each each.js:315
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    block effects.js:380
    each each.js:190
    consequent_7 UserMessage.svelte:596
    add_svelte_meta context.js:49
    consequent_7 UserMessage.svelte:595
    ensure branches.js:166
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    ensure branches.js:166
    update_branch if.js:55
    if_block if.js:63
    consequent_8 UserMessage.svelte:190
    if_block if.js:61
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    block effects.js:380
    if_block if.js:58
    consequent_8 UserMessage.svelte:723
    add_svelte_meta context.js:49
    consequent_8 UserMessage.svelte:722
    ensure branches.js:166
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    ensure branches.js:166
    update_branch if.js:55
    if_block if.js:63
    UserMessage UserMessage.svelte:189
    if_block if.js:61
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    block effects.js:380
    if_block if.js:58
    UserMessage UserMessage.svelte:737
    add_svelte_meta context.js:49
    UserMessage UserMessage.svelte:736
    effect2 hmr.js:47
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    wrapper hmr.js:38
    update_reaction runtime.js:297
    update_effect runtime.js:477
    traverse_effect_tree_fn batch.js:241
    process batch.js:178
    flush_effects batch.js:622
    flush batch.js:314
    ensure batch.js:502
    run_all utils.js:45
    run_micro_tasks task.js:10
    queue_micro_task task.js:28
    queue_micro_task task.js:19
    enqueue batch.js:512
    ensure batch.js:496
    internal_set sources.js:184
    set sources.js:163
    <anonymous> UserMessage.svelte:1670
    acceptExports client:46
    fetchUpdate client:218
    queueUpdate client:193
    queueUpdate client:193
    handleMessage client:642
    handleMessage client:640
    setupWebSocket client:550
    setupWebSocket client:549
    <anonymous> client:531
UserMessage.svelte:602:28
    fileUrl UserMessage.svelte:602
    untrack runtime.js:747
    fileUrl UserMessage.svelte:602
    update_reaction runtime.js:297
    execute_derived deriveds.js:332
    update_derived deriveds.js:356
    get runtime.js:684
    consequent_7 UserMessage.svelte:609
    e each.js:672
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    create_item each.js:672
    reconcile each.js:434
    commit each.js:163
    each each.js:315
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    block effects.js:380
    each each.js:190
    consequent_7 UserMessage.svelte:596
    add_svelte_meta context.js:49
    consequent_7 UserMessage.svelte:595
    ensure branches.js:166
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    ensure branches.js:166
    update_branch if.js:55
    if_block if.js:63
    consequent_8 UserMessage.svelte:190
    if_block if.js:61
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    block effects.js:380
    if_block if.js:58
    consequent_8 UserMessage.svelte:723
    add_svelte_meta context.js:49
    consequent_8 UserMessage.svelte:722
    ensure branches.js:166
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    ensure branches.js:166
    update_branch if.js:55
    if_block if.js:63
    UserMessage UserMessage.svelte:189
    if_block if.js:61
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    block effects.js:380
    if_block if.js:58
    UserMessage UserMessage.svelte:737
    add_svelte_meta context.js:49
    UserMessage UserMessage.svelte:736
    effect2 hmr.js:47
    update_reaction runtime.js:297
    update_effect runtime.js:477
    create_effect effects.js:126
    branch effects.js:392
    wrapper hmr.js:38
    update_reaction runtime.js:297
    update_effect runtime.js:477
    traverse_effect_tree_fn batch.js:241
    process batch.js:178
    flush_effects batch.js:622
    flush batch.js:314
    ensure batch.js:502
    run_all utils.js:45
    run_micro_tasks task.js:10
    queue_micro_task task.js:28
    (Async: VoidFunction)
    queue_micro_task task.js:19
    enqueue batch.js:512
    ensure batch.js:496
    internal_set sources.js:184
    set sources.js:163
    <anonymous> UserMessage.svelte:1670
    acceptExports client:46
    fetchUpdate client:218
    queueUpdate client:193
    forEach self-hosted:157
    queueUpdate client:193
    InterpretGeneratorResume self-hosted:1332
    AsyncFunctionNext self-hosted:800
    (Async: async)
    handleMessage client:642
    map self-hosted:175
    handleMessage client:640
    setupWebSocket client:550
    (Async: EventListener.handleEvent)
    setupWebSocket client:549
    <anonymous> client:531

Before

image

After

image

Contributor License Agreement

By submitting this pull request, I confirm that I have read and fully agree to the Contributor License Agreement (CLA), and I am providing my contributions under its terms.

Note

Deleting the CLA section will lead to immediate closure of your PR and it will not be merged in.


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/open-webui/open-webui/pull/20343 **Author:** [@silentoplayz](https://github.com/silentoplayz) **Created:** 1/3/2026 **Status:** ✅ Merged **Merged:** 1/3/2026 **Merged by:** [@tjbck](https://github.com/tjbck) **Base:** `dev` ← **Head:** `fix/user-message-undefined-file-url` --- ### 📝 Commits (1) - [`17c3fac`](https://github.com/open-webui/open-webui/commit/17c3fac2b1136966401cfb72b0c60279165053ff) fix: handle undefined file.url in UserMessage to prevent TypeError ### 📊 Changes **1 file changed** (+1 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `src/lib/components/chat/Messages/UserMessage.svelte` (+1 -1) </details> ### 📄 Description # Pull Request Checklist ### Note to first-time contributors: Please open a discussion post in [Discussions](https://github.com/open-webui/open-webui/discussions) to discuss your idea/fix with the community before creating a pull request, and describe your changes before submitting a pull request. This is to ensure large feature PRs are discussed with the community first, before starting work on it. If the community does not want this feature or it is not relevant for Open WebUI as a project, it can be identified in the discussion before working on the feature and submitting the PR. **Before submitting, make sure you've checked the following:** - [x] **Target branch:** Verify that the pull request targets the `dev` branch. - [x] **Description:** Provide a concise description of the changes made in this pull request down below. - [x] **Changelog:** Ensure a changelog entry following the format of [Keep a Changelog](https://keepachangelog.com/) is added at the bottom of the PR description. - [X] **Documentation:** If necessary, update relevant documentation [Open WebUI Docs](https://github.com/open-webui/docs) like environment variables, the tutorials, or other documentation sources. - [X] **Dependencies:** Are there any new dependencies? Have you updated the dependency versions in the documentation? - [x] **Testing:** Perform manual tests to **verify the implemented fix/feature works as intended AND does not break any other functionality**. - [x] **Agentic AI Code:** Confirm this Pull Request is **not written by any AI Agent** or has at least **gone through additional human review AND manual testing**. - [x] **Code review:** Have you performed a self-review of your code, addressing any coding standard issues and ensuring adherence to the project's coding standards? - [x] **Title Prefix:** To clearly categorize this pull request, prefix the pull request title using one of the following: - **BREAKING CHANGE**: Significant changes that may affect compatibility - **build**: Changes that affect the build system or external dependencies - **ci**: Changes to our continuous integration processes or workflows - **chore**: Refactor, cleanup, or other non-functional code changes - **docs**: Documentation update or addition - **feat**: Introduces a new feature or enhancement to the codebase - **fix**: Bug fix or error correction - **i18n**: Internationalization or localization changes - **perf**: Performance improvement - **refactor**: Code restructuring for better maintainability, readability, or scalability - **style**: Changes that do not affect the meaning of the code (white space, formatting, missing semi-colons, etc.) - **test**: Adding missing tests or correcting existing tests - **WIP**: Work in progress, a temporary label for incomplete or ongoing work --- # Changelog Entry ### Description This PR fixes a TypeError that occurs when rendering user messages with file attachments where the `file.url` property is `undefined`. The error `"can't access property 'startsWith', $.get(...).url is undefined"` was thrown when the code attempted to call `.startsWith()` on an undefined URL value. **Root cause:** The code in [UserMessage.svelte](cci:7://file:///home/g30/docker-projects/open-webui-dev/src/lib/components/chat/Messages/UserMessage.svelte:0:0-0:0) at line 197 was calling `file.url.startsWith()` without first checking if `file.url` exists, causing a crash when messages contained files with missing or undefined URL properties. **Solution:** Added optional chaining (`?.`) to safely access the [url](cci:1://file:///home/g30/docker-projects/open-webui-dev/backend/open_webui/retrieval/utils.py:61:0-63:51) property before calling `.startsWith()`, allowing the code to gracefully handle undefined values without throwing errors. ### Changed - Updated [UserMessage.svelte](cci:7://file:///home/g30/docker-projects/open-webui-dev/src/lib/components/chat/Messages/UserMessage.svelte:0:0-0:0) to use optional chaining when checking `file.url` property ### Fixed - **TypeError in UserMessage component** when `file.url` is undefined - Added optional chaining to `file.url.startsWith('data')` and `file.url.startsWith('http')` calls - Prevents application crash when rendering messages with file attachments that have undefined URLs - Error: `"Uncaught TypeError: can't access property 'startsWith', $.get(...).url is undefined"` ### Breaking Changes - None - change is backward compatible --- ### Additional Information #### Technical Details **Before:** ```typescript file.url.startsWith('data') || file.url.startsWith('http') ``` **After:** ```typescript file.url?.startsWith('data') || file.url?.startsWith('http') ``` The optional chaining operator (`?.`) ensures that if `file.url` is `undefined` or `null`, the expression returns `undefined` instead of throwing a TypeError. The ternary operator then falls through to the alternative path, constructing the URL using the API base path. ### Error Stack Trace (Fixed) ```js Uncaught TypeError: can't access property "startsWith", $.get(...).url is undefined in <unknown> in UserMessage.svelte in Message.svelte in Messages.svelte in pane.svelte in pane-group.svelte in Chat.svelte in +page.svelte in +layout.svelte in +layout.svelte in root.svelte fileUrl UserMessage.svelte:602 untrack runtime.js:747 fileUrl UserMessage.svelte:602 update_reaction runtime.js:297 execute_derived deriveds.js:332 update_derived deriveds.js:356 get runtime.js:684 consequent_7 UserMessage.svelte:609 e each.js:672 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 create_item each.js:672 reconcile each.js:434 commit each.js:163 each each.js:315 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 block effects.js:380 each each.js:190 consequent_7 UserMessage.svelte:596 add_svelte_meta context.js:49 consequent_7 UserMessage.svelte:595 ensure branches.js:166 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 ensure branches.js:166 update_branch if.js:55 if_block if.js:63 consequent_8 UserMessage.svelte:190 if_block if.js:61 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 block effects.js:380 if_block if.js:58 consequent_8 UserMessage.svelte:723 add_svelte_meta context.js:49 consequent_8 UserMessage.svelte:722 ensure branches.js:166 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 ensure branches.js:166 update_branch if.js:55 if_block if.js:63 UserMessage UserMessage.svelte:189 if_block if.js:61 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 block effects.js:380 if_block if.js:58 UserMessage UserMessage.svelte:737 add_svelte_meta context.js:49 UserMessage UserMessage.svelte:736 effect2 hmr.js:47 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 wrapper hmr.js:38 update_reaction runtime.js:297 update_effect runtime.js:477 traverse_effect_tree_fn batch.js:241 process batch.js:178 flush_effects batch.js:622 flush batch.js:314 ensure batch.js:502 run_all utils.js:45 run_micro_tasks task.js:10 queue_micro_task task.js:28 queue_micro_task task.js:19 enqueue batch.js:512 ensure batch.js:496 internal_set sources.js:184 set sources.js:163 <anonymous> UserMessage.svelte:1670 acceptExports client:46 fetchUpdate client:218 queueUpdate client:193 queueUpdate client:193 handleMessage client:642 handleMessage client:640 setupWebSocket client:550 setupWebSocket client:549 <anonymous> client:531 UserMessage.svelte:602:28 fileUrl UserMessage.svelte:602 untrack runtime.js:747 fileUrl UserMessage.svelte:602 update_reaction runtime.js:297 execute_derived deriveds.js:332 update_derived deriveds.js:356 get runtime.js:684 consequent_7 UserMessage.svelte:609 e each.js:672 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 create_item each.js:672 reconcile each.js:434 commit each.js:163 each each.js:315 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 block effects.js:380 each each.js:190 consequent_7 UserMessage.svelte:596 add_svelte_meta context.js:49 consequent_7 UserMessage.svelte:595 ensure branches.js:166 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 ensure branches.js:166 update_branch if.js:55 if_block if.js:63 consequent_8 UserMessage.svelte:190 if_block if.js:61 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 block effects.js:380 if_block if.js:58 consequent_8 UserMessage.svelte:723 add_svelte_meta context.js:49 consequent_8 UserMessage.svelte:722 ensure branches.js:166 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 ensure branches.js:166 update_branch if.js:55 if_block if.js:63 UserMessage UserMessage.svelte:189 if_block if.js:61 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 block effects.js:380 if_block if.js:58 UserMessage UserMessage.svelte:737 add_svelte_meta context.js:49 UserMessage UserMessage.svelte:736 effect2 hmr.js:47 update_reaction runtime.js:297 update_effect runtime.js:477 create_effect effects.js:126 branch effects.js:392 wrapper hmr.js:38 update_reaction runtime.js:297 update_effect runtime.js:477 traverse_effect_tree_fn batch.js:241 process batch.js:178 flush_effects batch.js:622 flush batch.js:314 ensure batch.js:502 run_all utils.js:45 run_micro_tasks task.js:10 queue_micro_task task.js:28 (Async: VoidFunction) queue_micro_task task.js:19 enqueue batch.js:512 ensure batch.js:496 internal_set sources.js:184 set sources.js:163 <anonymous> UserMessage.svelte:1670 acceptExports client:46 fetchUpdate client:218 queueUpdate client:193 forEach self-hosted:157 queueUpdate client:193 InterpretGeneratorResume self-hosted:1332 AsyncFunctionNext self-hosted:800 (Async: async) handleMessage client:642 map self-hosted:175 handleMessage client:640 setupWebSocket client:550 (Async: EventListener.handleEvent) setupWebSocket client:549 <anonymous> client:531 ``` ### Before <img width="2556" height="1279" alt="image" src="https://github.com/user-attachments/assets/c3e7f3cc-97f8-43ae-89e4-8b86b110bfb6" /> ### After <img width="2556" height="1279" alt="image" src="https://github.com/user-attachments/assets/2ff1df5f-c47e-467d-b873-033707a639f5" /> ### Contributor License Agreement By submitting this pull request, I confirm that I have read and fully agree to the [Contributor License Agreement (CLA)](https://github.com/open-webui/open-webui/blob/main/CONTRIBUTOR_LICENSE_AGREEMENT), and I am providing my contributions under its terms. > [!NOTE] > Deleting the CLA section will lead to immediate closure of your PR and it will not be merged in. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-04-20 06:00:32 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/open-webui#25576