Added data-cy and updated conflicting packages (#1051)

* Added data-cy

* Updted conflicting packages

Author: gaagul

package.json

@@ -90,7 +90,7 @@
     "antd": "5.10.2",
     "autoprefixer": "10.4.16",
     "axios": "1.6.2",
-    "babel-loader": "9.1.3",
+    "babel-loader": "^8.2.5",
     "babel-plugin-istanbul": "6.1.1",
     "babel-plugin-js-logger": "1.0.17",
     "babel-plugin-macros": "3.1.0",

src/components/Attachments/Attachment.jsx

@@ -117,7 +117,7 @@ const Attachment = ({
 
   return (
     <>
-      <div className="ne-attachments__preview">
+      <div className="ne-attachments__preview" data-cy="ne-attachments-wrapper">
         {isRenaming ? (
           <>
             <Tooltip content={newFilename} position="top">
@@ -165,9 +165,9 @@ const Attachment = ({
               position="top"
             >
               <Dropdown
+                {...{ disabled }}
                 buttonSize="small"
                 buttonStyle="text"
-                {...{ disabled }}
                 icon={MenuVertical}
               >
                 <Menu>

src/components/Attachments/Preview.jsx

@@ -9,6 +9,7 @@ import { Trans, useTranslation } from "react-i18next";
 
 import { convertToFileSize } from "components/Editor/MediaUploader/utils";
 
+import { ATTACHMENTS_PREVIEW_DATA_CY } from "./constants";
 import { checkPreviewAvailability, downloadFile } from "./utils";
 
 const Preview = ({
@@ -59,18 +60,27 @@ const Preview = ({
     if (isPreviewAvailable) {
       switch (contentType.split("/")[0]) {
         case "image":
-          return <img src={url} />;
+          return <img data-cy={ATTACHMENTS_PREVIEW_DATA_CY} src={url} />;
         case "video":
-          return <video controls src={url} />;
+          return (
+            <video controls data-cy={ATTACHMENTS_PREVIEW_DATA_CY} src={url} />
+          );
         case "application":
         case "text":
           if (contentType === "application/pdf") {
-            return <iframe src={url} width="100%" />;
+            return (
+              <iframe
+                data-cy={ATTACHMENTS_PREVIEW_DATA_CY}
+                src={url}
+                width="100%"
+              />
+            );
           }
 
           return (
             <DocViewer
               className="ne-attachments-preview__body-docviewer"
+              data-cy={ATTACHMENTS_PREVIEW_DATA_CY}
               documents={[{ uri: url, fileType: contentType }]}
               pluginRenderers={DocViewerRenderers}
               config={{
@@ -102,10 +112,10 @@ const Preview = ({
 
   return (
     <Modal
+      {...{ onClose }}
       className="ne-attachments-preview"
       isOpen={!isEmpty(selectedAttachment)}
       size="fullScreen"
-      {...{ onClose }}
       onKeyDown={handleKeyDown}
     >
       <Modal.Header className="ne-attachments-preview__header">

src/components/Attachments/constants.js

@@ -13,3 +13,5 @@ export const ATTACHMENT_OPTIONS = {
   RENAME: "Rename",
   DELETE: "Delete",
 };
+
+export const ATTACHMENTS_PREVIEW_DATA_CY = "ne-attachments-preview-content";

src/components/Editor/Menu/Fixed/FontSizeOption.jsx

@@ -43,7 +43,7 @@ const FontSizeOption = ({ editor, tooltipContent }) => {
       >
         {FONT_SIZE_OPTIONS.map(({ label, value, key }) => (
           <MenuItem.Button
-            data-cy={`neeto-editor-fixed-menu-font-size-option-${label}`}
+            data-cy={`neeto-editor-fixed-menu-font-size-option-${key}`}
             key={value}
             onClick={() => handleClick(value)}
           >