CB-4060 feat: remove data-testid attribute (#2166)

Co-authored-by: mr-anton-t <[email protected]>
dbeaver · Dec 6, 2023 · b83cd0d · b83cd0d
1 parent 669ad9c
commit b83cd0d
Show file tree

Hide file tree

Showing 14 changed files with 23 additions and 194 deletions.
diff --git a/webapp/packages/core-blocks/src/FormControls/Checkboxes/Switch.tsx b/webapp/packages/core-blocks/src/FormControls/Checkboxes/Switch.tsx
@@ -72,12 +72,12 @@ export const Switch: SwitchType = observer(function Switch({
   }
 
   return (
-    <Field data-testid="field" title={rest.title}>
-      <div data-testid="switch-body" className={styles.switchBody}>
-        <div data-testid="switch-control" className={s(styles, { switchControl: true, disabled: disabled, checked: checkboxState.checked })}>
-          <div data-testid="switch-control-track" className={styles.switchControlTrack} />
-          <div data-testid="switch-control-underlay" className={styles.switchControlUnderlay}>
-            <div data-testid="switch-control-thumb" className={styles.switchControlThumb} />
+    <Field title={rest.title}>
+      <div className={styles.switchBody}>
+        <div className={s(styles, { switchControl: true, disabled: disabled, checked: checkboxState.checked })}>
+          <div className={styles.switchControlTrack} />
+          <div className={styles.switchControlUnderlay}>
+            <div className={styles.switchControlThumb} />
             <input
               {...rest}
               type="checkbox"
@@ -86,13 +86,12 @@ export const Switch: SwitchType = observer(function Switch({
               aria-checked={checkboxState.checked}
               checked={checkboxState.checked}
               disabled={disabled}
-              data-testid="switch-input"
               className={styles.switchInput}
               onChange={checkboxState.change}
             />
           </div>
         </div>
-        <FieldLabel htmlFor={id || value || name} data-testid="field-label" className={styles.fieldLabel}>
+        <FieldLabel htmlFor={id || value || name} className={styles.fieldLabel}>
           {children}
         </FieldLabel>
       </div>

diff --git a/webapp/packages/core-blocks/src/FormControls/Combobox.tsx b/webapp/packages/core-blocks/src/FormControls/Combobox.tsx
@@ -293,13 +293,7 @@ export const Combobox: ComboboxType = observer(function Combobox({
         <MenuButton {...menu} disabled={readOnly || disabled || hideMenu} className={styles.menuButton}>
           <Icon name="arrow" viewBox="0 0 16 16" className={s(styles, { icon: true, focus })} />
         </MenuButton>
-        <Menu
-          {...menu}
-          ref={menuRef}
-          aria-label={propertyName}
-          className={s(styles, { menu: true })}
-          modal
-        >
+        <Menu {...menu} ref={menuRef} aria-label={propertyName} className={s(styles, { menu: true })} modal>
           {!filteredItems.length ? (
             <MenuItem id="placeholder" disabled {...menu} className={s(styles, { menuItem: true })}>
               {translate('combobox_no_results_placeholder')}
@@ -322,11 +316,11 @@ export const Combobox: ComboboxType = observer(function Combobox({
                   onClick={event => handleSelect(event.currentTarget.id)}
                 >
                   {iconSelector && (
-                    <div data-testid="item-icon" className={s(styles, { itemIcon: true })}>
+                    <div className={s(styles, { itemIcon: true })}>
                       {icon && typeof icon === 'string' ? <IconOrImage icon={icon} className={s(styles, { iconOrImage: true })} /> : icon}
                     </div>
                   )}
-                  <div data-testid="item-value">{valueSelector(item)}</div>
+                  <div>{valueSelector(item)}</div>
                 </MenuItem>
               );
             })

diff --git a/webapp/packages/core-blocks/src/FormControls/InputField.tsx b/webapp/packages/core-blocks/src/FormControls/InputField.tsx
@@ -192,11 +192,7 @@ export const InputField: InputFieldType = observer<ControlledProps | ObjectProps
               <Icon name="copy" viewBox="0 0 32 32" className={styles.icon} />
             </div>
           )}
-          {icon && (
-            <div data-testid="icon-container" className={s(styles, { customIconContainer: true })}>
-              {icon}
-            </div>
-          )}
+          {icon && <div className={s(styles, { customIconContainer: true })}>{icon}</div>}
         </div>
         {(description || passwordType) && <FieldDescription invalid={error}>{description}</FieldDescription>}
       </Field>

diff --git a/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarBody.tsx b/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarBody.tsx
@@ -17,14 +17,12 @@ interface Props {
 export const SnackbarBody: React.FC<React.PropsWithChildren<Props>> = function SnackbarBody({ title, className, children }) {
   const styles = useS(style);
   return (
-    <div data-testid="notification-body" className={s(styles, { notificationBody: true }, className)}>
-      <div data-testid="body-text-block" className={styles.bodyTextBlock}>
-        <h2 data-testid="text-block-title" title={title} className={styles.textBlockTitle}>
+    <div className={s(styles, { notificationBody: true }, className)}>
+      <div className={styles.bodyTextBlock}>
+        <h2 title={title} className={styles.textBlockTitle}>
           {title}
         </h2>
-        <div data-testid="message" className={styles.message}>
-          {children}
-        </div>
+        <div className={styles.message}>{children}</div>
       </div>
     </div>
   );

diff --git a/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarContent.tsx b/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarContent.tsx
@@ -15,9 +15,5 @@ interface Props {
 
 export const SnackbarContent: React.FC<React.PropsWithChildren<Props>> = function SnackbarContent({ children, className }) {
   const styles = useS(style);
-  return (
-    <div data-testid="notification-content" className={s(styles, { notificationContent: true }, className)}>
-      {children}
-    </div>
-  );
+  return <div className={s(styles, { notificationContent: true }, className)}>{children}</div>;
 };
diff --git a/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarFooter.tsx b/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarFooter.tsx
@@ -19,13 +19,9 @@ export const SnackbarFooter: React.FC<React.PropsWithChildren<Props>> = function
   const timeStringFromTimestamp = new Date(timestamp).toLocaleTimeString();
 
   return (
-    <div data-testid="notification-footer" className={s(styles, { notificationFooter: true }, className)}>
-      <span data-testid="footer-time" className={styles.footerTime}>
-        {timeStringFromTimestamp}
-      </span>
-      <div data-testid="actions" className={styles.actions}>
-        {children}
-      </div>
+    <div className={s(styles, { notificationFooter: true }, className)}>
+      <span className={styles.footerTime}>{timeStringFromTimestamp}</span>
+      <div className={styles.actions}>{children}</div>
     </div>
   );
 };
diff --git a/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarStatus.tsx b/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarStatus.tsx
@@ -21,7 +21,7 @@ interface SnackbarStatusProps {
 export const SnackbarStatus: React.FC<SnackbarStatusProps> = function SnackbarStatus({ status, className }) {
   const styles = useS(style);
   return status === ENotificationType.Loading ? (
-    <div data-testid="loader-container" className={s(styles, { loaderContainer: true }, className)}>
+    <div className={s(styles, { loaderContainer: true }, className)}>
       <Loader className={styles.loader} hideMessage />
     </div>
   ) : (

diff --git a/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarWrapper.tsx b/webapp/packages/core-blocks/src/Snackbars/SnackbarMarkups/SnackbarWrapper.tsx
@@ -34,7 +34,7 @@ export const SnackbarWrapper: React.FC<React.PropsWithChildren<Props>> = functio
   }, []);
 
   return (
-    <div data-testid="notification" className={s(styles, { notification: true, mounted, closing }, className)}>
+    <div className={s(styles, { notification: true, mounted, closing }, className)}>
       {children}
       {!persistent && onClose && (
         <IconButton name="cross" viewBox="0 0 16 16" className={s(styles, { iconButton: true, large: true })} onClick={onClose} />

diff --git a/webapp/packages/core-cli/configs/babel.config.js b/webapp/packages/core-cli/configs/babel.config.js
@@ -5,8 +5,6 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-/* eslint-disable @typescript-eslint/no-var-requires */
-const testingAttributes = require('../dist/babel-plugins/TestingAttributes.js');
 
 module.exports = api => {
   const devMode = !api.env('production');
@@ -28,6 +26,6 @@ module.exports = api => {
         },
       ],
     ],
-    plugins: [[testingAttributes, {}], [require('@reshadow/babel'), {}], devMode && require.resolve('react-refresh/babel')].filter(Boolean),
+    plugins: [[require('@reshadow/babel'), {}], devMode && require.resolve('react-refresh/babel')].filter(Boolean),
   };
 };
diff --git a/webapp/packages/core-cli/package.json b/webapp/packages/core-cli/package.json
@@ -21,9 +21,6 @@
     "core-cli-validate-dependencies": "./bin/validate-dependencies.js",
     "typescript-resolve-references": "./bin/typescript-resolve-references.js"
   },
-  "scripts": {
-    "install": "tsc"
-  },
   "engines": {
     "node": ">=16.0.0"
   },

diff --git a/webapp/packages/core-cli/src/babel-plugins/TestingAttributes.ts b/webapp/packages/core-cli/src/babel-plugins/TestingAttributes.ts
diff --git a/webapp/packages/core-cli/tsconfig.eslint.json b/webapp/packages/core-cli/tsconfig.eslint.json
diff --git a/webapp/packages/core-cli/tsconfig.json b/webapp/packages/core-cli/tsconfig.json
diff --git a/...ion-tree/src/NavigationTree/ElementsTree/NavTreeLimitFilter/elementsTreeLimitRenderer.tsx b/...ion-tree/src/NavigationTree/ElementsTree/NavTreeLimitFilter/elementsTreeLimitRenderer.tsx
@@ -38,7 +38,7 @@ const NavTreeLimitMessage: NavigationNodeRendererComponent = observer(function N
   }
 
   return (
-    <div className={s(styles, { loadMoreBox: true })} data-testid="load-more-box">
+    <div className={s(styles, { loadMoreBox: true })}>
       <Link title={translate('app_navigationTree_limited', undefined, { limit: limit })} onClick={loadMore}>
         {translate('ui_load_more')}
       </Link>