Help Needed: Homepage Dashboard “Failed to construct ‘URL’” Error

Hi everyone! 👋

I’m encountering a persistent issue with my self-hosted Homepage dashboard (v1.1.1). Some tabs with bookmarks fail to load, showing the error:

TypeError: Failed to construct ‘URL’: Invalid URL

This happens on multiple tabs, including Accessibility_Resources and Shopping. I’ve tried troubleshooting by:

  • Validating my YAML files (all are valid).

  • Using lowercase tab names without special characters.

  • Ensuring all URLs in bookmarks.yaml are absolute (http:// or https://).

  • Clearing browser cache and testing in multiple browsers.

Despite these efforts, the issue persists. The error appears in the browser console as follows:

TypeError: Failed to construct 'URL': Invalid URL    at F (index-3a04b80eb558747c.js:1:42899)    at af (framework-bbeeca9707659ffa.js:1:65163)    ...

I suspect the issue might be related to how Homepage processes bookmarks or tab names internally. Below are my full configuration files for reference (API keys and sensitive data redacted):

widgets.yaml

- search:    provider: custom    url: https://search.laniecarmelo.tech/search?q=%25s    target: _blank    suggestionUrl: https://search.laniecarmelo.tech/autocompleter?q=%25s    showSearchSuggestions: true- datetime:    format:        dateStyle: full        timeStyle: long        hour12: true- openmeteo:    label: Pipe Creek, TX    latitude: 29.538    longitude: -98.524    units: imperial    timezone: America/Chicago

docker.yaml

my-docker:  socket: /var/run/docker.sock

bookmarks.yaml

---- Accessibility_Resources:    - WebAIM Accessibility Tools:        abbr: WT        href: https://webaim.org/resources/        description: Tools and resources for web accessibility testing.    - A11Y Project:        abbr: AP        href: https://www.a11yproject.com/        description: Community-driven effort to make web accessibility easier.    - W3C Web Accessibility Initiative:        abbr: WA        href: https://www.w3.org/WAI/        description: Guidelines and resources for web accessibility.    - WCAG Guidelines:        abbr: WG        href: https://www.w3.org/WAI/WCAG22/quickref/        description: Quick reference for WCAG 2.1 guidelines.    - Accessibility Resources:        abbr: AR        href: https://www.w3.org/WAI/resources/        description: Comprehensive resources for web accessibility.    - Accessibility Tools:        abbr: AT        href: https://www.w3.org/WAI/test-evaluate/        description: Tools for testing and evaluating web accessibility.    - Accessibility Tutorials:        abbr: TU        href: https://www.w3.org/WAI/tutorials/        description: Tutorials on web accessibility best practices.    - WebAlign:        abbr: WL        href: https://members.convergeaccessibility.com/member-log-in/        description: Online tool for creating accessible web content.    - Contrast Checker:        abbr: CC        href: https://webaim.org/resources/contrastchecker/        description: Tool for checking color contrast ratios for accessibility.- Automation:    - Apprise Documentation:        abbr: AD        href: https://github.com/caronc/apprise/wiki/        description: Notification management tool supporting multiple services.    - Home Assistant Community:        abbr: HC        href: https://community.home-assistant.io/        description: Forum for Home Assistant users to discuss automation setups.    - Home Assistant Documentation:        abbr: HD        href: https://www.home-assistant.io/docs/        description: Official documentation for Home Assistant.    - Home Assistant Blog:        abbr: HB        href: https://www.home-assistant.io/blog/        description: Updates and news about Home Assistant.- Communication:    - Shlink Documentation:        abbr: SD        href: https://shlink.io/documentation/        description: Learn how to set up and manage Shlink.    - Element:        abbr: EL        href: https://chat.tchncs.de/        description: Secure messaging and collaboration platform.    - Outlook:        abbr: OL        href: https://outlook.office365.com/        description: Email and calendar service from Microsoft.    - Google Messages:        abbr: GM        href: https://messages.google.com/        description: SMS and MMS messaging service from Google.    - Enafore:        abbr: EN        href: https://enafore.social/        description: Alternative frontend for Mastodon, a decentralized social network.    - Mastodon:        abbr: MA        href: https://allovertheplace.ca/        description: Decentralized social network platform.    - Discord:        abbr: DC        href: https://discord.com/        description: Voice, video, and text chat platform for communities.- Developer:    - freeCodeCamp:        abbr: FC        href: https://www.freecodecamp.org/        description: Learn to code with free tutorials and projects.    - MDN Web Docs:        abbr: MD        href: https://developer.mozilla.org/        description: Comprehensive web development documentation.    - GitHub:        abbr: GH        href: https://github.com/        description: Code hosting, collaboration, and version control.    - Stack Overflow:        abbr: SO        href: https://stackoverflow.com/        description: Community-driven Q&A for programmers.    - GitLab:        abbr: GL        href: https://gitlab.com/        description: Web-based DevOps lifecycle tool providing a Git repository manager.- Information_Management:    - AppleVis:        abbr: AV        href: https://www.applevis.com/        description: Community for blind and low-vision users of Apple products.    - BibleGateway:        abbr: BG        href: https://www.biblegateway.com/        description: Search and read the Bible in multiple translations.    - Bible Resources:        abbr: BR        href: https://biblehub.com/        description: Online Bible study tools and comprehensive resources.    - YouVersion:        abbr: YV        href: https://www.youversion.com/        description: Bible app with various translations and reading plans.    - Bible Study Fellowship:        abbr: BS        href: https://www.bsfinternational.org/        description: Bible study resources and community.    - Bookshare:        abbr: BK        href: https://www.bookshare.org/        description: Accessible online library for people with print disabilities.    - BARD:        abbr: BD        href: https://nlsbard.loc.gov/        description: Braille and Audio Reading Download service for eligible users.    - Audible:        abbr: AU        href: https://www.audible.com/        description: Audiobook and spoken word entertainment service.- Productivity:    - CCU Library:        abbr: CL        href: https://www.ccu.edu/academics/library/        description: Access CCU library resources for research and study.    - ReadWorks:        abbr: RW        href: https://www.readworks.org/        description: Reading passages and comprehension activities.    - Perplexity AI:        abbr: PA        href: https://perplexity.ai/        description: AI-powered search with detailed, conversational responses.- Education:    - Codecademy:        abbr: CA        href: https://www.codecademy.com/        description: Interactive coding lessons for various languages.    - NFB:        abbr: NF        href: https://nfb.org/        description: Resources for Braille transcription and blind community.    - Canvas:        abbr: CV        href: https://canvas.instructure.com/        description: Learning management system for online courses.- Gaming_Entertainment:    - AudioGames:        abbr: AG        href: https://forum.audiogames.net/        description: Community for audio-based and accessible games.    - IncrementalDB:        abbr: ID        href: https://incrementaldb.com/        description: Database of incremental games.    - Galaxy Click:        abbr: GC        href: https://galaxy.click/        description: Open-source website for finding incremental games.- Shopping:    - InnoSearch AI:        abbr: IS        href: https://innosearch.ai/        description: Accessible e-commerce platform designed for blind users.    - Amazon:        abbr: AZ        href: https://www.amazon.com/        description: Online shopping platform with a wide range of products.    - eBay:        abbr: EB        href: https://www.ebay.com/        description: Online auction and shopping website.    - Walmart:        abbr: WM        href: https://www.walmart.com/        description: Online shopping platform with a wide range of products.    - Best Buy:        abbr: BB        href: https://www.bestbuy.com/        description: Online shopping platform for electronics and appliances.

services.yaml

---- Automation:    - Home Assistant:        href: https://homeassistant.laniecarmelo.tech/        description: Home automation platform        server: my-docker        container: homeassistant    - N8N:        href: https://n8n.laniecarmelo.tech/        description: Workflow automation tool        server: my-docker        container: n8n    - Ntfy:        href: https://ntfy.laniecarmelo.tech/        description: Self-hosted notification service        server: my-docker        container: ntfy- Communication:    - Shlink:        href: https://app.shlink.io/        description: URL shortener and link management        server: my-docker        container: shlink    - TheLounge:        href: https://irc.laniecarmelo.tech/        description: Web-based IRC client- Developer:    - Forgejo:        href: https://git.laniecarmelo.tech/        description: My Git server        widget:            type: gitea            url: https://git.laniecarmelo.tech/            key: redacted    - PrivateBin:        href: https://paste.laniecarmelo.tech/        description: Pastebin for sharing code snippets- Information_Management:    - Linkding:        href: https://bookmarks.laniecarmelo.tech/        description: Self-hosted bookmark manager        server: my-docker        container: linkding    - MiniFlux:        href: https://rss.laniecarmelo.tech/        description: Self-hosted RSS feed reader        widget:                 type: miniflux            url: https://rss.laniecarmelo.tech/            key: redacted    - RSS-Bridge:        href: https://rss-bridge.laniecarmelo.tech/        description: RSS feed generator for various websites        server: my-docker        container: rss-bridge    - SearXNG:        href: https://search.laniecarmelo.tech/        description: Self-hosted metasearch engine    - Wallabag:        href: https://read.laniecarmelo.tech/        description: Self-hosted read-it-later service        server: my-docker        container: wallabag- Monitoring:    - Beszel:        href: https://beszel.laniecarmelo.tech/        description: Server monitoring and alerts        widget:            type: beszel            url: https://beszel.laniecarmelo.tech/            version: 2            username: redacted            password: redacted            systemId: redacted    - Caddy:        href: https://caddy.laniecarmelo.tech/        description: Reverse proxy and SSL management        widget:            type: caddy            url: https://caddy.laniecarmelo.tech/    - Uptime Kuma:        href: https://uptime.laniecarmelo.tech/        description: Uptime monitoring and status page        server: my-docker        container: uptime-kuma        widget:            type: uptimekuma            url: https://uptime.laniecarmelo.tech/            slug: home    - Watchtower:        description: Docker container update monitoring        server: my-docker        container: watchtower        widget:            type: watchtower            url: http://192.168.1.137:3014/            key: redacted- Productivity:    - Beaver Habit Tracker:        href: https://habits.laniecarmelo.tech/        description: Habit tracking and productivity        server: my-docker        container: beaverhabits    - Calendar:        description: My Outlook calendar        widget:            type: calendar            firstDayInWeek: sunday            view: agenda            showTime: true            timezone: America/Chicago            integrations:                - type: ical                  url: redacted                  name: Outlook    - Joplin Server:        href: https://notes.laniecarmelo.tech/        description: Notes and knowledge management        server: my-docker        container: joplin_server    - Mealie:        href: https://recipes.laniecarmelo.tech/        description: Recipe management and meal planning        server: my-docker        container: mealie        widget:            type: mealie            url: https://recipes.laniecarmelo.tech/            key: redacted            version: 2- Server_Management:    - Cockpit:        href: https://cockpit.laniecarmelo.tech/        description: Web-based server management interface    - Dockge:        href: https://dockge.laniecarmelo.tech/        description: Docker management interface        server: my-docker        container: stacks-dockge-1    - Dozzle:        href: https://dozzle.laniecarmelo.tech/        description: Docker container logs viewer        server: my-docker        container: dozzle    - Tailscale (Raspberry Pi):        href: https://login.tailscale.com/        description: Zero-config mesh VPN        widget:            type: tailscale            deviceid: redacted            key: redacted    - Tailscale (Mini PC):        href: https://login.tailscale.com/        description: Zero-config mesh VPN        widget:            type: tailscale            deviceid: redacted            key: redacted    - Tailscale (iPhone):        href: https://login.tailscale.com/        description: Zero-config mesh VPN        widget:            type: tailscale            deviceid: redacted            key: redacted    - Tailscale (Google Pixel 9 Pro):        href: https://login.tailscale.com/        description: Zero-config mesh VPN        widget:            type: tailscale            deviceid: redacted            key: redacted

settings.yaml

title: Stormux Dashboarddescription: Links to and information about my self-hosted services and most-used sitesbase: https://home.laniecarmelo.techtheme/: darklanguage: entarget: _blankquicklaunch:  searchDescriptions: true  showSearchSuggestions: true  provider: custom  url: https://search.laniecarmelo.tech/search?q=%25s  suggestionUrl: https://search.laniecarmelo.tech/autocompleter?q=%25slayout:  # Assign each group to a tab  Accessibility_Resources:    tab: Accessibility_Resources  Automation:    tab: Automation  Communication:    tab: Communication  Developer:    tab: Developer  Education:    tab: Education  Gaming_Entertainment:    tab: Gaming_Entertainment  Information_Management:    tab: Information_Management  Monitoring:    tab: Monitoring  Productivity:    tab: Productivity  Server_Management:    tab: Server_Management  Shopping:    tab: ShoppingshowStats: true

compose.yaml

services:  homepage:    image: ghcr.io/gethomepage/homepage:latest    container_name: homepage    ports:      - 3000:3000    volumes:      - ./config:/app/config # Make sure your local config directory exists      - /var/run/docker.sock:/var/run/docker.sock # (optional) For docker integrations    environment:      HOMEPAGE_ALLOWED_HOSTS: home.laniecarmelo.tech,192.168.1.137:3000,stormux:3000      LOG_LEVEL: debug    restart: unless-stopped

If you’ve encountered this issue before or have insights into resolving it, I’d greatly appreciate your help! 🙏

Hashtags:

#SelfHosting #HomepageDashboard #WebDev #Accessibility #YAML #Bookmarks #OpenSource

Thank you in advance! 😊

@selfhosted @selfhost @selfhosting@slrpnk.net @selfhosting@a.gup.pe

  • bigredgiraffe@lemmy.world
    link
    fedilink
    English
    arrow-up
    2
    ·
    1 day ago

    Just to make sure, all of your links need to be in quotes if they are not. The : in a url can make some yaml parsers think that it is another block, there are other URL safe characters in general that are special characters in yaml so it’s a good idea to put them in quotes.

  • Tolookah@discuss.tchncs.de
    link
    fedilink
    English
    arrow-up
    1
    ·
    1 day ago

    In bookmarks: abbr gets a dash, href does not. (Neither does description)

    - website:
    (Space space) - abbr: WB
    (Space space space space) href: url-here
    (Space space space space) description: it’s a link

    I can’t manage indents

  • n8vos@lemmy.world
    link
    fedilink
    English
    arrow-up
    7
    ·
    2 days ago

    Have you tried getting just one link to work? Troubleshooting is best when you start with a small problem and work up to more complexity. Narrow down what the issue is. You dumped a ton of data and text in your post. I don’t have a page of bookmarks in my dashboard. I tried a link at one point and never got it to work. I assumed at the time it had to do with http vs https but just decided I don’t need that link in my HA dashboard. Good luck to you.

    • Tolookah@discuss.tchncs.de
      link
      fedilink
      English
      arrow-up
      2
      ·
      2 days ago

      What they said. Comment stuff out until it works, then SLOWLY add things back in until it breaks. There is probably one line that you can point to as problematic, and it’ll be easier to troubleshoot that way.

      My homepage dashboard is a bunch of links, any bad url was my fault, usually misformed.

      I had one case where I had placed files for download and found that homepage makes copies on start, so changing those on the fly doesn’t work and requires a restart. (Most yml changes don’t and only need a refresh)

      I believe docker labels also need more effort than just a restart, but I’m no expert there, I was forcefully recreating the image that I added labels to.

  • RagingHungryPanda@lemm.ee
    link
    fedilink
    English
    arrow-up
    2
    ·
    2 days ago

    To add on, you can comment in a “binary search” method. Comment out one half of them, if it’s still there, half again, etc and keep going down until you find it.

    I’m on mobile and can’t make out any of it, but good luck!