test: Adopt jest testing in `ui-composer` #35932

dougfabris · 2025-05-06T15:42:06Z

Proposed changes (including videos or screenshots)

Issue(s)

Steps to test or reproduce

Further comments

This pull request refactors the MessageComposerInput component in the RocketChat/Rocket.Chat repository by using margin instead of padding. It introduces several updates and additions to the ui-composer package:

Storybook Configuration: An accessibility addon is added to the Storybook configuration to enhance component accessibility testing.
Jest Configuration: A new Jest configuration file is added, including preset and module mappings to facilitate testing.
Testing Enhancements:
- New test cases are introduced for the MessageComposer, MessageComposerHint, and MessageFooterCallout components, focusing on rendering and accessibility checks.
- Jest snapshot tests are added for MessageComposer, MessageComposerHint, and MessageFooterCallout components to ensure UI consistency and detect unintended rendering changes.
Story Title Updates:
- The story title path for the MessageComposerHint component is updated.
- The story title for MessageFooterCallout is changed from 'Components/MessageComposer/Locked' to 'Components/MessageComposerCallout' to better reflect the component's purpose.
Type Definition and Property Adjustment: The MessageComposerInput.tsx file is updated to simplify type definitions and adjust the padding property.

These changes aim to improve the maintainability and accessibility of the ui-composer components while ensuring consistent UI behavior through comprehensive testing.

dionisio-bot · 2025-05-06T15:42:10Z

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

kodus-ai · 2025-05-06T15:42:14Z

Code Review Completed! 🔥

The code review was successfully completed based on your current configurations.

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

packages/ui-composer/src/MessageComposer/MessageComposer.spec.tsx

github-actions · 2025-05-06T15:49:12Z

PR Preview Action v1.6.1
🚀 View preview at https://RocketChat.github.io/Rocket.Chat/pr-preview/pr-35932/
Built to branch `gh-pages` at 2025-05-07 13:23 UTC. Preview will be ready when the GitHub Pages deployment is complete.

changeset-bot · 2025-05-06T15:51:13Z

⚠️ No Changeset found

Latest commit: c133382

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

kodus-ai · 2025-05-06T15:51:50Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

codecov · 2025-05-06T16:41:19Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 61.34%. Comparing base (9b0d87a) to head (c133382).
Report is 12 commits behind head on develop.

Additional details and impacted files

@@             Coverage Diff             @@
##           develop   #35932      +/-   ##
===========================================
+ Coverage    61.29%   61.34%   +0.04%     
===========================================
  Files         3164     3184      +20     
  Lines        74796    74930     +134     
  Branches     16693    16698       +5     
===========================================
+ Hits         45847    45966     +119     
- Misses       25849    25859      +10     
- Partials      3100     3105       +5

Flag	Coverage Δ
e2e	`58.07% <ø> (-0.02%)`	⬇️
unit	`75.22% <100.00%> (+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.

kodus-ai · 2025-05-06T16:46:13Z

Code Review Completed! 🔥

The code review was successfully completed based on your current configurations.

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

packages/ui-composer/tsconfig.build.json

kodus-ai · 2025-05-06T18:03:57Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

kodus-ai · 2025-05-06T18:43:25Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

kodus-ai · 2025-05-07T13:14:06Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

kodus-ai · 2025-05-07T13:18:58Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

kodus-ai bot reviewed May 6, 2025

View reviewed changes

packages/ui-composer/src/MessageComposer/MessageComposer.spec.tsx Show resolved Hide resolved

dougfabris changed the title ~~refactor: MessageComposerInput using margin instead of padding~~ refactor: Adopt jest testing in ui-composer pkg May 6, 2025

dougfabris added this to the 7.7.0 milestone May 6, 2025

dougfabris force-pushed the refactor/message-composer-input branch from a85ebb2 to ee06249 Compare May 6, 2025 15:51

dougfabris changed the title ~~refactor: Adopt jest testing in ui-composer pkg~~ refactor: Adopt jest testing in ui-composer May 6, 2025

dougfabris added the accessibility label May 6, 2025

dougfabris force-pushed the refactor/message-composer-input branch from ee06249 to 95e1fe7 Compare May 6, 2025 16:45

dougfabris changed the title ~~refactor: Adopt jest testing in ui-composer~~ test: Adopt jest testing in ui-composer May 6, 2025

kodus-ai bot reviewed May 6, 2025

View reviewed changes

packages/ui-composer/tsconfig.build.json Show resolved Hide resolved

dougfabris removed the accessibility label May 6, 2025

dougfabris added 2 commits May 6, 2025 15:42

refactor: MessageComposerInput using margin instead of padding

127ad0c

chore: update snapshots

977dd8a

dougfabris force-pushed the refactor/message-composer-input branch from e06f0e2 to 977dd8a Compare May 6, 2025 18:42

dougfabris marked this pull request as ready for review May 7, 2025 13:06

chore: stories name

c133382

dougfabris force-pushed the refactor/message-composer-input branch from cc789eb to c133382 Compare May 7, 2025 13:18

dougfabris mentioned this pull request May 7, 2025

refactor: Use padding instead of margin in MessageComposerInput #35942

Merged

ggazzo added the stat: QA assured Means it has been tested and approved by a company insider label May 7, 2025

ggazzo merged commit 6145b89 into develop May 7, 2025
48 checks passed

dionisio-bot bot added the stat: ready to merge PR tested and approved waiting for merge label May 7, 2025

ggazzo deleted the refactor/message-composer-input branch May 7, 2025 20:48

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

test: Adopt jest testing in `ui-composer` #35932

test: Adopt jest testing in `ui-composer` #35932

dougfabris commented May 6, 2025 •

edited by jira bot

Loading

dionisio-bot bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

github-actions bot commented May 6, 2025 •

edited

Loading

Built to branch `gh-pages` at 2025-05-07 13:23 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

changeset-bot bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

codecov bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 7, 2025 •

edited

Loading

kodus-ai bot commented May 7, 2025 •

edited

Loading

test: Adopt jest testing in ui-composer #35932

test: Adopt jest testing in ui-composer #35932

Conversation

dougfabris commented May 6, 2025 • edited by jira bot Loading

Proposed changes (including videos or screenshots)

Issue(s)

Steps to test or reproduce

Further comments

dionisio-bot bot commented May 6, 2025 • edited Loading

kodus-ai bot commented May 6, 2025 • edited Loading

Code Review Completed! 🔥

github-actions bot commented May 6, 2025 • edited Loading

Built to branch gh-pages at 2025-05-07 13:23 UTC. Preview will be ready when the GitHub Pages deployment is complete.

changeset-bot bot commented May 6, 2025 • edited Loading

⚠️ No Changeset found

kodus-ai bot commented May 6, 2025 • edited Loading

Kody Review Complete

codecov bot commented May 6, 2025 • edited Loading

Codecov Report

kodus-ai bot commented May 6, 2025 • edited Loading

Code Review Completed! 🔥

kodus-ai bot commented May 6, 2025 • edited Loading

Kody Review Complete

kodus-ai bot commented May 6, 2025 • edited Loading

Kody Review Complete

kodus-ai bot commented May 7, 2025 • edited Loading

Kody Review Complete

kodus-ai bot commented May 7, 2025 • edited Loading

Kody Review Complete

test: Adopt jest testing in `ui-composer` #35932

test: Adopt jest testing in `ui-composer` #35932

dougfabris commented May 6, 2025 •

edited by jira bot

Loading

dionisio-bot bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

github-actions bot commented May 6, 2025 •

edited

Loading

Built to branch `gh-pages` at 2025-05-07 13:23 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

changeset-bot bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

codecov bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 6, 2025 •

edited

Loading

kodus-ai bot commented May 7, 2025 •

edited

Loading

kodus-ai bot commented May 7, 2025 •

edited

Loading