Skip to content

Conversation

@yash-rajpal
Copy link
Member

@yash-rajpal yash-rajpal commented Dec 16, 2025

Proposed changes (including videos or screenshots)

Iframe external commands were not working as given here

Issue(s)

Steps to test or reproduce

  • Embed Rocket.Chat into an iframe
  • Send post message to this iframe as given on docs, here

Further comments

CORE-1564

Summary by CodeRabbit

  • Bug Fixes
    • Fixed handling of external iframe commands sent via window.postMessage when the app is embedded inside an iframe. Commands are now properly validated against allowed origins, respect the configurable origin settings and enable/disable flag, and unknown or disallowed commands are rejected to improve reliability and security.

✏️ Tip: You can customize this high-level summary in your review settings.

@dionisio-bot
Copy link
Contributor

dionisio-bot bot commented Dec 16, 2025

Looks like this PR is ready to merge! 🎉
If you have any trouble, please check the PR guidelines

@changeset-bot
Copy link

changeset-bot bot commented Dec 16, 2025

🦋 Changeset detected

Latest commit: 6999be3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 42 packages
Name Type
@rocket.chat/meteor Patch
@rocket.chat/core-typings Patch
@rocket.chat/rest-typings Patch
@rocket.chat/uikit-playground Patch
@rocket.chat/api-client Patch
@rocket.chat/apps Patch
@rocket.chat/core-services Patch
@rocket.chat/cron Patch
@rocket.chat/ddp-client Patch
@rocket.chat/freeswitch Patch
@rocket.chat/fuselage-ui-kit Patch
@rocket.chat/gazzodown Patch
@rocket.chat/http-router Patch
@rocket.chat/livechat Patch
@rocket.chat/model-typings Patch
@rocket.chat/ui-avatar Patch
@rocket.chat/ui-client Patch
@rocket.chat/ui-contexts Patch
@rocket.chat/ui-voip Patch
@rocket.chat/web-ui-registration Patch
@rocket.chat/account-service Patch
@rocket.chat/authorization-service Patch
@rocket.chat/ddp-streamer Patch
@rocket.chat/omnichannel-transcript Patch
@rocket.chat/presence-service Patch
@rocket.chat/queue-worker Patch
@rocket.chat/stream-hub-service Patch
@rocket.chat/abac Patch
@rocket.chat/federation-matrix Patch
@rocket.chat/license Patch
@rocket.chat/media-calls Patch
@rocket.chat/omnichannel-services Patch
@rocket.chat/pdf-worker Patch
@rocket.chat/presence Patch
rocketchat-services Patch
@rocket.chat/models Patch
@rocket.chat/network-broker Patch
@rocket.chat/omni-core-ee Patch
@rocket.chat/mock-providers Patch
@rocket.chat/ui-video-conf Patch
@rocket.chat/instance-status Patch
@rocket.chat/omni-core Patch

Not sure what this means? Click here to learn what changesets are.

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

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Dec 16, 2025

Walkthrough

Refactors iframe postMessage handling from a module-level listener to a React hook. Adds a patch-level changeset for @rocket.chat/meteor and integrates the new useIframeCommands hook into AppLayout; removes the previous startup import that registered the global listener.

Changes

Cohort / File(s) Summary
Changeset entry
.changeset/odd-pigs-hang.md
Adds a patch-level changeset documenting a fix for iframe external commands sent via window.postMessage when Rocket.Chat is embedded in an iframe.
Startup refactor
apps/meteor/client/startup/index.ts
Removes the import of the old iframeCommands module to stop module-level side-effect listener registration during app startup.
Hook integration
apps/meteor/client/views/root/AppLayout.tsx
Imports and invokes useIframeCommands() within the AppLayout component so iframe message handling is tied to the component lifecycle.
Hook implementation
apps/meteor/client/views/root/hooks/useIframeCommands.ts
New exported React hook that registers a message listener via useEffect, uses useSetting feature flags (Iframe_Integration_receive_enable, Iframe_Integration_receive_origin), validates origins (supports '*' and comma-separated lists), validates commands against a commands map, executes mapped handlers, logs errors for unknown commands or disallowed origins, and cleans up the listener on unmount/dependencies change.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

  • Primary focus: apps/meteor/client/views/root/hooks/useIframeCommands.ts for origin parsing/validation logic, message handling, command dispatch, and correct useEffect dependencies/cleanup.
  • Also review AppLayout.tsx integration and removal of the startup import to ensure no initialization gaps.

Possibly related PRs

Suggested reviewers

  • gabriellsh
  • juliajforesti

Poem

🐰 I hopped into code with a curious twitch,
Found messages tangled and missing a stitch.
I turned them to hooks, gave origins a check,
Now frames send their notes without causing a wreck,
Hooray — postMessage hops back without a glitch! ✨

Pre-merge checks and finishing touches

✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'fix: iframe external commands' directly describes the main change in the PR, which addresses broken iframe external command handling via postMessage.
Linked Issues check ✅ Passed The PR successfully restores iframe external command handling by converting from global window listener to hook-based architecture, validating origins, and properly executing mapped commands as documented.
Out of Scope Changes check ✅ Passed All changes are scoped to iframe external command handling: removing old listener setup, refactoring to hook-based approach, and integrating into AppLayout lifecycle.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch chore/iframe-external-commands

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

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

@yash-rajpal yash-rajpal marked this pull request as ready for review December 16, 2025 12:39
@yash-rajpal yash-rajpal requested a review from a team as a code owner December 16, 2025 12:39
@yash-rajpal yash-rajpal added the stat: QA assured Means it has been tested and approved by a company insider label Dec 16, 2025
@yash-rajpal yash-rajpal added this to the 7.14.0 milestone Dec 16, 2025
@dionisio-bot dionisio-bot bot added the stat: ready to merge PR tested and approved waiting for merge label Dec 16, 2025
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

  • Jira integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between cf4dfcd and cc77f92.

📒 Files selected for processing (4)
  • .changeset/odd-pigs-hang.md (1 hunks)
  • apps/meteor/client/startup/index.ts (0 hunks)
  • apps/meteor/client/views/root/AppLayout.tsx (2 hunks)
  • apps/meteor/client/views/root/hooks/useIframeCommands.ts (2 hunks)
💤 Files with no reviewable changes (1)
  • apps/meteor/client/startup/index.ts
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{ts,tsx,js}

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

**/*.{ts,tsx,js}: Write concise, technical TypeScript/JavaScript with accurate typing in Playwright tests
Avoid code comments in the implementation

Files:

  • apps/meteor/client/views/root/hooks/useIframeCommands.ts
  • apps/meteor/client/views/root/AppLayout.tsx
🧠 Learnings (2)
📓 Common learnings
Learnt from: d-gubert
Repo: RocketChat/Rocket.Chat PR: 37654
File: apps/meteor/client/hooks/useAppSlashCommands.ts:32-38
Timestamp: 2025-12-02T22:23:49.593Z
Learning: In apps/meteor/client/hooks/useAppSlashCommands.ts, the `data?.forEach((command) => slashCommands.add(command))` call during render is intentional. The query is configured with `structuralSharing: false` to prevent React Query from keeping stable data references, and `slashCommands.add` is idempotent, so executing on every render is acceptable and ensures the command registry stays current.
📚 Learning: 2025-12-02T22:23:49.593Z
Learnt from: d-gubert
Repo: RocketChat/Rocket.Chat PR: 37654
File: apps/meteor/client/hooks/useAppSlashCommands.ts:32-38
Timestamp: 2025-12-02T22:23:49.593Z
Learning: In apps/meteor/client/hooks/useAppSlashCommands.ts, the `data?.forEach((command) => slashCommands.add(command))` call during render is intentional. The query is configured with `structuralSharing: false` to prevent React Query from keeping stable data references, and `slashCommands.add` is idempotent, so executing on every render is acceptable and ensures the command registry stays current.

Applied to files:

  • apps/meteor/client/views/root/hooks/useIframeCommands.ts
  • apps/meteor/client/views/root/AppLayout.tsx
🧬 Code graph analysis (2)
apps/meteor/client/views/root/hooks/useIframeCommands.ts (1)
packages/ui-contexts/src/index.ts (1)
  • useSetting (72-72)
apps/meteor/client/views/root/AppLayout.tsx (1)
apps/meteor/client/views/root/hooks/useIframeCommands.ts (1)
  • useIframeCommands (97-130)
⏰ 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). (3)
  • GitHub Check: 📦 Build Packages
  • GitHub Check: CodeQL-Build
  • GitHub Check: CodeQL-Build
🔇 Additional comments (4)
apps/meteor/client/views/root/hooks/useIframeCommands.ts (2)

97-130: Well-structured hook with proper lifecycle management.

The refactoring from module-level initialization to a React hook is a good improvement. The effect properly:

  • Guards on the feature flag
  • Validates origin and command before execution
  • Returns cleanup to remove the listener

17-91: Command handlers are well-implemented with proper input validation.

The commands properly validate inputs before execution, and the OAuth redirect URL validation (line 57-60) provides protection against open redirect attacks.

apps/meteor/client/views/root/AppLayout.tsx (1)

24-25: Clean integration following the existing hook pattern.

The placement alongside useIframeLoginListener is logical and the invocation follows the established pattern in this component.

Also applies to: 75-75

.changeset/odd-pigs-hang.md (1)

1-5: Changeset appropriately documents the fix.

The patch level and description accurately reflect the nature of this bug fix.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (1)
apps/meteor/client/views/root/hooks/useIframeCommands.ts (1)

120-121: Consider improving type safety for the command handler.

The any type could be replaced with a more specific type to improve type safety.

Apply this diff:

-		const command: (data: any, event: MessageEvent) => void = commands[event.data.externalCommand];
+		const command = commands[event.data.externalCommand];

TypeScript will correctly infer the type based on the commands object, eliminating the need for an explicit type annotation.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

  • Jira integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between cc77f92 and 81d6fe3.

📒 Files selected for processing (1)
  • apps/meteor/client/views/root/hooks/useIframeCommands.ts (2 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{ts,tsx,js}

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

**/*.{ts,tsx,js}: Write concise, technical TypeScript/JavaScript with accurate typing in Playwright tests
Avoid code comments in the implementation

Files:

  • apps/meteor/client/views/root/hooks/useIframeCommands.ts
🧠 Learnings (2)
📓 Common learnings
Learnt from: d-gubert
Repo: RocketChat/Rocket.Chat PR: 37654
File: apps/meteor/client/hooks/useAppSlashCommands.ts:32-38
Timestamp: 2025-12-02T22:23:49.593Z
Learning: In apps/meteor/client/hooks/useAppSlashCommands.ts, the `data?.forEach((command) => slashCommands.add(command))` call during render is intentional. The query is configured with `structuralSharing: false` to prevent React Query from keeping stable data references, and `slashCommands.add` is idempotent, so executing on every render is acceptable and ensures the command registry stays current.
📚 Learning: 2025-12-02T22:23:49.593Z
Learnt from: d-gubert
Repo: RocketChat/Rocket.Chat PR: 37654
File: apps/meteor/client/hooks/useAppSlashCommands.ts:32-38
Timestamp: 2025-12-02T22:23:49.593Z
Learning: In apps/meteor/client/hooks/useAppSlashCommands.ts, the `data?.forEach((command) => slashCommands.add(command))` call during render is intentional. The query is configured with `structuralSharing: false` to prevent React Query from keeping stable data references, and `slashCommands.add` is idempotent, so executing on every render is acceptable and ensures the command registry stays current.

Applied to files:

  • apps/meteor/client/views/root/hooks/useIframeCommands.ts
🧬 Code graph analysis (1)
apps/meteor/client/views/root/hooks/useIframeCommands.ts (1)
packages/ui-contexts/src/index.ts (1)
  • useSetting (72-72)
⏰ 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). (3)
  • GitHub Check: 📦 Build Packages
  • GitHub Check: CodeQL-Build
  • GitHub Check: CodeQL-Build
🔇 Additional comments (3)
apps/meteor/client/views/root/hooks/useIframeCommands.ts (3)

1-15: LGTM! Imports properly updated for hook-based implementation.

The addition of useSetting and useEffect correctly supports the refactor from a global listener to a React hook. The relative import paths have been updated to match the new file location.


97-104: LGTM! Proper feature flag and configuration handling.

The hook correctly retrieves settings and uses an early return to prevent listener registration when the feature is disabled.


124-129: LGTM! Proper listener lifecycle management.

The effect correctly registers the listener and cleans it up on unmount or when dependencies change. The dependency array includes both iframeReceiveEnabled and iframeReceiveOrigin, ensuring the listener is properly re-registered when configuration changes.

@github-actions
Copy link
Contributor

github-actions bot commented Dec 16, 2025

📦 Docker Image Size Report

📈 Changes

Service Current Baseline Change Percent
sum of all images 1.2GiB 1.2GiB +12MiB
rocketchat 358MiB 347MiB +12MiB
omnichannel-transcript-service 132MiB 132MiB -1.2KiB
queue-worker-service 132MiB 132MiB +769B
ddp-streamer-service 126MiB 126MiB +532B
account-service 113MiB 113MiB -477B
authorization-service 111MiB 111MiB +867B
stream-hub-service 111MiB 111MiB -271B
presence-service 111MiB 111MiB -129B

📊 Historical Trend

---
config:
  theme: "dark"
  xyChart:
    width: 900
    height: 400
---
xychart
  title "Image Size Evolution by Service (Last 30 Days + This PR)"
  x-axis ["11/15 22:28", "11/16 01:28", "11/17 23:50", "11/18 22:53", "11/19 23:02", "11/21 16:49", "11/24 17:34", "11/27 22:32", "11/28 19:05", "12/01 23:01", "12/02 21:57", "12/03 21:00", "12/04 18:17", "12/05 21:56", "12/08 20:15", "12/09 22:17", "12/10 23:26", "12/11 21:56", "12/12 22:45", "12/13 01:34", "12/15 22:31", "12/16 22:18", "12/17 21:04", "12/18 23:12", "12/19 23:27", "12/20 16:45", "12/20 17:11 (PR)"]
  y-axis "Size (GB)" 0 --> 0.5
  line "account-service" [0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11]
  line "authorization-service" [0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11]
  line "ddp-streamer-service" [0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12, 0.12]
  line "omnichannel-transcript-service" [0.14, 0.14, 0.14, 0.14, 0.14, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13]
  line "presence-service" [0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11]
  line "queue-worker-service" [0.14, 0.14, 0.14, 0.14, 0.14, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13, 0.13]
  line "rocketchat" [0.36, 0.36, 0.35, 0.35, 0.35, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.34, 0.35]
  line "stream-hub-service" [0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11, 0.11]
Loading

Statistics (last 26 days):

  • 📊 Average: 1.5GiB
  • ⬇️ Minimum: 1.2GiB
  • ⬆️ Maximum: 1.6GiB
  • 🎯 Current PR: 1.2GiB
ℹ️ About this report

This report compares Docker image sizes from this build against the develop baseline.

  • Tag: pr-37829
  • Baseline: develop
  • Timestamp: 2025-12-20 17:11:41 UTC
  • Historical data points: 26

Updated: Sat, 20 Dec 2025 17:11:41 GMT

@codecov
Copy link

codecov bot commented Dec 16, 2025

Codecov Report

❌ Patch coverage is 33.33333% with 14 lines in your changes missing coverage. Please review.
✅ Project coverage is 67.68%. Comparing base (572c963) to head (6999be3).
⚠️ Report is 1 commits behind head on develop.

Additional details and impacted files

Impacted file tree graph

@@           Coverage Diff            @@
##           develop   #37829   +/-   ##
========================================
  Coverage    67.68%   67.68%           
========================================
  Files         3476     3476           
  Lines       113895   113902    +7     
  Branches     20956    20955    -1     
========================================
+ Hits         77088    77095    +7     
+ Misses       34619    34617    -2     
- Partials      2188     2190    +2     
Flag Coverage Δ
e2e 57.15% <33.33%> (+0.02%) ⬆️
e2e-api 43.99% <ø> (-0.10%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

🚀 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.

@kodiakhq kodiakhq bot removed the stat: ready to merge PR tested and approved waiting for merge label Dec 17, 2025
@kodiakhq
Copy link
Contributor

kodiakhq bot commented Dec 17, 2025

This PR currently has a merge conflict. Please resolve this and then re-add the ['stat: ready to merge', 'automerge'] label.

@yash-rajpal yash-rajpal added the stat: ready to merge PR tested and approved waiting for merge label Dec 18, 2025
@kodiakhq kodiakhq bot merged commit 92a121b into develop Dec 20, 2025
47 checks passed
@kodiakhq kodiakhq bot deleted the chore/iframe-external-commands branch December 20, 2025 17:34
gaolin1 pushed a commit to gaolin1/medsense.webchat that referenced this pull request Jan 6, 2026
@dougfabris dougfabris modified the milestones: 7.14.0, 8.0.0 Jan 19, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

stat: QA assured Means it has been tested and approved by a company insider stat: ready to merge PR tested and approved waiting for merge

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants