fix(cloudflare): add baseURL if no operations but source was relative

[FKarstein]

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

🔗 Linked issue

📚 Description

I've added hasProtocol(src) to decide wether the src url can be returned as is or if it needs the baseURL prepended.

The bug was introduced with this change:
c68e111#diff-1982745bb2a7ce7f4f529e1d43edfb0b98a52d03876e61b5dbaf9fb2ac28dda3

and the currently open PR:
#2126

did not fix the issue for me, because it uses the nuxt.baseURL and not the one configured for the provider.

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/@nuxt/image@2162

commit: 000d181

[coderabbitai]

📝 Walkthrough

Walkthrough

The Cloudflare image provider's fallback URL resolution logic was modified to handle relative paths more explicitly. The import statement now includes hasProtocol from the 'ufo' library. When no image operations are generated, the provider checks whether the source URL already contains a protocol. If it does, the URL is returned as-is; otherwise, it is joined with the baseURL to create an absolute path.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes the main fix: adding baseURL handling for relative source URLs in Cloudflare provider when no operations are present.
Description check	✅ Passed	The description directly relates to the changeset, explaining the bug fix, the root cause, and why previous approaches were insufficient.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@src/runtime/providers/cloudflare.ts`:
- Line 49: The URL assembly incorrectly treats protocol-relative sources as
relative because hasProtocol(src) is used; update the check to hasProtocol(src,
{ acceptRelative: true }) (or refactor the ternary into an if/else) so
protocol-relative URLs (e.g., //cdn.example.com/...) are treated as absolute and
not joined with baseURL; adjust the expression that sets url (which uses
joinURL, baseURL, operations, src) to use this updated hasProtocol call and
preserve the existing logic for operations and normal relative paths.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 08251f8a-a5f9-4907-b3a3-6aaa2c53549e

📥 Commits

Reviewing files that changed from the base of the PR and between af0d0a2 and d18ccec.

📒 Files selected for processing (1)

• src/runtime/providers/cloudflare.ts

[coderabbitai]

⚠️ Potential issue | 🟡 Minor

🧩 Analysis chain

🌐 Web query:

Does ufo hasProtocol function return true for protocol-relative URLs like //example.com by default?

💡 Result:

No. In unjs/ufo, hasProtocol("//example.com") returns false by default; it only returns true for protocol-relative (scheme-relative) URLs if you pass { acceptRelative: true }. [1]

---

Handle protocol-relative URLs in the src parameter.

The code doesn't account for protocol-relative URLs (e.g., //cdn.example.com/image.jpg). Since hasProtocol returns false for these by default, they would be incorrectly joined with baseURL, producing malformed results like https://mysite.com//cdn.example.com/image.jpg.

Use hasProtocol(src, { acceptRelative: true }) to properly detect protocol-relative URLs as absolute:

Fix for protocol-relative URL handling

-    const url = operations ? joinURL(baseURL, 'cdn-cgi/image', operations, src) : hasProtocol(src) ? src : joinURL(baseURL, src)
+    const url = operations ? joinURL(baseURL, 'cdn-cgi/image', operations, src) : hasProtocol(src, { acceptRelative: true }) ? src : joinURL(baseURL, src)

Alternatively, the nested ternary could be rewritten as an if-else block for improved readability.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/runtime/providers/cloudflare.ts` at line 49, The URL assembly incorrectly
treats protocol-relative sources as relative because hasProtocol(src) is used;
update the check to hasProtocol(src, { acceptRelative: true }) (or refactor the
ternary into an if/else) so protocol-relative URLs (e.g., //cdn.example.com/...)
are treated as absolute and not joined with baseURL; adjust the expression that
sets url (which uses joinURL, baseURL, operations, src) to use this updated
hasProtocol call and preserve the existing logic for operations and normal
relative paths.

[codecov-commenter]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 32.52%. Comparing base (af0d0a2) to head (d18ccec).

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #2162   +/-   ##
=======================================
  Coverage   32.52%   32.52%           
=======================================
  Files           7        7           
  Lines         372      372           
  Branches      131      131           
=======================================
  Hits          121      121           
  Misses        194      194           
  Partials       57       57           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.