CSS Modules: migrate Text Attachment components (#5670)

* CSS Modules: migrate Text Attachment components

* Fix remaining tests

* Changelog

Author: OEvgeny

CHANGELOG.md

@@ -313,7 +313,10 @@ Breaking changes in this release:
 - Bumped Chrome in Docker to 141 from 110, in PR [#5619](https://github.com/microsoft/BotFramework-WebChat/pull/5619), by [@compulim](https://github.com/compulim)
 - Bumped to [`valibot@1.2.0`](https://npmjs.com/package/valibot/v/1.2.0), in PR [#5650](https://github.com/microsoft/BotFramework-WebChat/pull/5650), by [@compulim](https://github.com/compulim)
 - Pinned to [`botframework-directlinespeech-sdk@4.18.1-main.20251208.8ccadd6`](https://npmjs.com/package/botframework-directlinespeech-sdk/v/4.18.1-main.20251208.8ccadd6), by [@OEvgeny](https://github.com/OEvgeny) in PR [#5662](https://github.com/microsoft/BotFramework-WebChat/pull/5662)
-- Converted remaining activity components to CSS Modules, in PR [#5668](https://github.com/microsoft/BotFramework-WebChat/pull/5668), in PR [#5669](https://github.com/microsoft/BotFramework-WebChat/pull/5669), by [@OEvgeny](https://github.com/OEvgeny)
+- Converted activity components to CSS Modules
+   - Bubble, carousel, say-alt, in PR [#5668](https://github.com/microsoft/BotFramework-WebChat/pull/5668), by [@OEvgeny](https://github.com/OEvgeny)
+   - Activity status, in PR [#5669](https://github.com/microsoft/BotFramework-WebChat/pull/5669), by [@OEvgeny](https://github.com/OEvgeny)
+   - Text attachment and related components, in PR [#5670](https://github.com/microsoft/BotFramework-WebChat/pull/5670), by [@OEvgeny](https://github.com/OEvgeny)
 
 ### Deprecated
 

__tests__/html2/activity/citation.longRef.html

@@ -53,7 +53,7 @@
 
         await host.snapshot('local');
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownLinks = markdownElement.querySelectorAll('a');
         const markdownButtons = markdownElement.querySelectorAll('button');
 

__tests__/html2/basic/customIcons.html

@@ -39,11 +39,11 @@
         --webchat__fluent-icon--mask: var(--icon);
       }
 
-      #webchat .webchat__activity-button .component-icon.icon--view-code {
+      #webchat .activity-button .component-icon.icon--view-code {
         --webchat__component-icon--mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M8 17.308L2.692 12L8 6.692l.714.714l-4.6 4.6L8.708 16.6zm8 0l-.713-.714l4.6-4.6L15.292 7.4L16 6.692L21.308 12z'/%3E%3C/svg%3E");
       }
 
-      #webchat .webchat__activity-button .component-icon.icon--copy {
+      #webchat .activity-button .component-icon.icon--copy {
         --webchat__component-icon--mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9.116 17q-.691 0-1.153-.462T7.5 15.385V4.615q0-.69.463-1.153T9.116 3h7.769q.69 0 1.153.462t.462 1.153v10.77q0 .69-.462 1.152T16.884 17zm0-1h7.769q.23 0 .423-.192t.192-.423V4.615q0-.23-.192-.423T16.884 4H9.116q-.231 0-.424.192t-.192.423v10.77q0 .23.192.423t.423.192m-3 4q-.69 0-1.153-.462T4.5 18.385V6.615h1v11.77q0 .23.192.423t.423.192h8.77v1zM8.5 16V4z'/%3E%3C/svg%3E");
       }
     </style>

__tests__/html2/citation/basic.html

@@ -44,7 +44,7 @@
 
         await host.snapshot('local');
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownLinks = markdownElement.querySelectorAll('a');
         const markdownButtons = markdownElement.querySelectorAll('button');
 

__tests__/html2/citation/claimInterpreter/dangerousLink.html

@@ -57,7 +57,7 @@
 
         await host.snapshot('local');
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownLinks = markdownElement.querySelectorAll('a');
 
         // The javascript: shouldn't be a link.

__tests__/html2/citation/markdownPreferredOverEntities.html

@@ -78,7 +78,7 @@
 
         await host.snapshot('local');
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownClickableLinks = markdownElement.querySelectorAll('a[href]');
 
         // The javascript: shouldn't be a link.

__tests__/html2/citation/showModal.close.button.html

@@ -41,7 +41,7 @@
           type: 'message'
         });
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownButtons = markdownElement.querySelectorAll('button');
 
         await host.click(markdownButtons[0]);

__tests__/html2/citation/showModal.close.escape.html

@@ -41,7 +41,7 @@
           type: 'message'
         });
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownButtons = markdownElement.querySelectorAll('button');
 
         await host.click(markdownButtons[0]);

__tests__/html2/citation/showModal.markdown.html

@@ -42,7 +42,7 @@
           type: 'message'
         });
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownButtons = markdownElement.querySelectorAll('button');
 
         await host.click(markdownButtons[0]);

__tests__/html2/citation/showModal.width.desktop.html

@@ -44,7 +44,7 @@
 
         await host.snapshot('local');
 
-        const markdownElement = pageElements.activities()[0].querySelector('.webchat__text-content__markdown');
+        const markdownElement = pageElements.activities()[0].querySelector('.text-content__markdown');
         const markdownButtons = markdownElement.querySelectorAll('button');
 
         await host.click(markdownButtons[0]);