fix(webapp): add recommended security headers

[myftija]

Sets Referrer-Policy, X-Content-Type-Options and Permissions-Policy headers.
Relevant against certain types of attacks.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 4592e82

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[coderabbitai]

Walkthrough

A new exported function, headers(), is added to apps/webapp/app/root.tsx. It returns an object specifying three HTTP response headers: Referrer-Policy, X-Content-Type-Options, and Permissions-Policy. This function is introduced alongside existing exports to supply security-related headers in responses.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Description Check	⚠️ Warning	The provided description only states the headers being set and a generic note about relevance to attacks, but it does not follow the repository’s required template structure—none of the mandated sections like the issue link, checklist, testing steps, changelog, or screenshots are present. It lacks the “Closes #” reference and all template headings, making it incomplete against the template requirements.	Please update the description to use the repository’s template by including the “Closes #” line, completing the checklist items, detailing testing steps, summarizing changes in the changelog section, and adding screenshots if applicable.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title Check	✅ Passed	The title “fix(webapp): add recommended security headers” clearly and concisely summarizes the primary change by indicating that security headers are being added in the webapp scope and follows the conventional commit style for a fix. It directly reflects the core functionality introduced in the pull request without any extraneous information.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

• 📝 Generate Docstrings

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch security-headers

---

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: 0

🧹 Nitpick comments (1)

apps/webapp/app/root.tsx (1)

23-28: Type the export and consider a couple of low‑risk, high‑value headers

Good addition. Suggest minor polish plus optional hardening:

• Add Remix’s HeadersFunction type for consistency.
• Optionally add frame/cross‑origin isolation protections (validate with product first).

Apply:

- export const headers = () => ({
+ export const headers: HeadersFunction = () => ({
   "Referrer-Policy": "strict-origin-when-cross-origin",
   "X-Content-Type-Options": "nosniff",
+  "X-Frame-Options": "SAMEORIGIN",
+  "Cross-Origin-Opener-Policy": "same-origin",
+  "Cross-Origin-Resource-Policy": "same-site",
   "Permissions-Policy":
     "geolocation=(), microphone=(), camera=(), accelerometer=(), gyroscope=(), magnetometer=(), payment=(), usb()",
 })

And import the type:

- import type { LinksFunction, LoaderFunctionArgs, MetaFunction } from "@remix-run/node";
+ import type { LinksFunction, LoaderFunctionArgs, MetaFunction, HeadersFunction } from "@remix-run/node";

Note: COOP/CORP and XFO can affect embedding/postMessage scenarios; validate before enabling. As per coding guidelines.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 3ceea77 and 4592e82.

📒 Files selected for processing (1)

• apps/webapp/app/root.tsx (1 hunks)

🧰 Additional context used

📓 Path-based instructions (3)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

**/*.{ts,tsx}: Always prefer using isomorphic code like fetch, ReadableStream, etc. instead of Node.js specific code
For TypeScript, we usually use types over interfaces
Avoid enums
No default exports, use function declarations

Files:

• apps/webapp/app/root.tsx

{packages/core,apps/webapp}/**/*.{ts,tsx}

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

We use zod a lot in packages/core and in the webapp

Files:

• apps/webapp/app/root.tsx

apps/webapp/**/*.{ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/webapp.mdc)

When importing from @trigger.dev/core in the webapp, never import the root package path; always use one of the documented subpath exports from @trigger.dev/core’s package.json

Files:

• apps/webapp/app/root.tsx

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (14)

• GitHub Check: units / internal / 🧪 Unit Tests: Internal (7, 8)
• GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (8, 8)
• GitHub Check: units / internal / 🧪 Unit Tests: Internal (3, 8)
• GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (6, 8)
• GitHub Check: units / internal / 🧪 Unit Tests: Internal (1, 8)
• GitHub Check: units / internal / 🧪 Unit Tests: Internal (2, 8)
• GitHub Check: units / internal / 🧪 Unit Tests: Internal (4, 8)
• GitHub Check: units / internal / 🧪 Unit Tests: Internal (5, 8)
• GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (4, 8)
• GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (1, 8)
• GitHub Check: e2e / 🧪 CLI v3 tests (windows-latest - npm)
• GitHub Check: units / packages / 🧪 Unit Tests: Packages (1, 1)
• GitHub Check: e2e / 🧪 CLI v3 tests (windows-latest - pnpm)
• GitHub Check: typecheck / typecheck

🔇 Additional comments (1)

apps/webapp/app/root.tsx (1)

23-28: Permissions-Policy header safe to deploy
No in-code references to geolocation, camera/microphone (getUserMedia), sensors, Payment Request API, Apple Pay, or USB detected; the current header won’t break existing flows. Note: this header only applies to document responses—configure it at the edge/server if you need it on assets or resource routes.