Issue #9 - [BUG] Fix Runtime Error When Validating Social Media Image URL

[codepath-open-source-ci]

Motivation

The PuterHomepageService is responsible for serving the Puter homepage and configuring social media metadata, including the social media preview image. When an invalid social media image URL is provided (either malformed or with an unsupported file extension), the service needs to validate it and fall back to a default image.

Currently, the validation logic has a critical bug that causes a runtime error when an invalid URL is encountered. This prevents the homepage from loading properly and degrades the user experience.

Current Behavior

The social media image validation logic attempts to reassign a const variable when the URL fails validation checks. In JavaScript, const variables cannot be reassigned after their initial declaration.

Reproduction Steps

1. Navigate to src/backend/src/services/PuterHomepageService.js
2. Locate the social media image validation logic (around line 219)
3. Configure the service with an invalid social media image URL
   • Example: a URL without a valid image extension like .txt, or a malformed URL
4. Start the service and attempt to load the homepage
5. Observe: The service throws a runtime error attempting to reassign the const social_media_image variable

Expected Behavior

The service should validate the social media image URL without causing runtime errors.
When an invalid URL is provided, the validation logic should detect the issue and use the default social media image instead.

The validation should:

• Ensure the URL is properly formed
• Check that it ends with a valid image extension (.png, .jpg, .jpeg, .gif, or .webp)

Acceptance Criteria

• The validation logic does not attempt to reassign const variables
• Invalid URLs (malformed or non-absolute) are properly detected and handled
• URLs without valid image extensions are properly detected and handled
• When validation fails, the service falls back to the default social media image (${asset_dir}/images/screenshot.png)
• The homepage loads successfully regardless of whether the configured social media image URL is valid or invalid

Steps to Test

1. Set a valid social media image URL

   • Example: https://example.com/image.png

2. Open the homepage in a browser

   • Verify the page loads successfully (no errors).
   • Check page source → og:image and twitter:image meta tags show the configured image URL.

3. Set an invalid image URL (bad extension)

   • Example: https://example.com/file.txt

4. Reload the homepage

   • Verify the page still loads (no runtime error).
   • Confirm og:image and twitter:image now show the default fallback image (${asset_dir}/images/screenshot.png).

5. Set a malformed or non-absolute URL

   • Example: not-a-valid-url or /relative/path.png

6. Reload the homepage

   • Confirm it still loads successfully.
   • Verify fallback image is used again.
   • Check console/logs → no “Assignment to constant variable” or similar runtime errors.

Submission

Download https://cap.so/ to record your screen (use Studio mode). Export as an mp4, and drag and drop into an issue comment below.

Guide to submitting pull requests: https://hackmd.io/@timothy1ee/Hky8kV3hlx