test: scroll persists tests

Author: shubh-bruno

packages/bruno-app/src/components/BulkEditor/index.js

@@ -31,7 +31,7 @@ const BulkEditor = ({ params, onChange, onToggle, onSave, onRun }) => {
         />
       </div>
       <div className="flex btn-action justify-between items-center mt-3">
-        <button className="text-link select-none ml-auto" onClick={onToggle}>
+        <button className="text-link select-none ml-auto" data-testid="key-value-edit-toggle" onClick={onToggle}>
           Key/Value Edit
         </button>
       </div>

packages/bruno-app/src/components/CollectionSettings/Headers/index.js

@@ -138,7 +138,7 @@ const Headers = ({ collection }) => {
         onColumnWidthsChange={(widths) => handleColumnWidthsChange('collection-headers', widths)}
       />
       <div className="flex justify-end mt-2">
-        <button className="text-link select-none" onClick={toggleBulkEditMode}>
+        <button className="text-link select-none" data-testid="bulk-edit-toggle" onClick={toggleBulkEditMode}>
           Bulk Edit
         </button>
       </div>

packages/bruno-app/src/components/CollectionSettings/Script/index.js

@@ -107,7 +107,7 @@ const Script = ({ collection }) => {
           </TabsTrigger>
         </TabsList>
 
-        <TabsContent value="pre-request" className="mt-2">
+        <TabsContent value="pre-request" className="mt-2" data-testid="collection-pre-request-script-editor">
           <CodeEditor
             ref={preRequestEditorRef}
             collection={collection}
@@ -123,7 +123,7 @@ const Script = ({ collection }) => {
           />
         </TabsContent>
 
-        <TabsContent value="post-response" className="mt-2">
+        <TabsContent value="post-response" className="mt-2" data-testid="collection-post-response-script-editor">
           <CodeEditor
             ref={postResponseEditorRef}
             collection={collection}

packages/bruno-app/src/components/FolderSettings/Headers/index.js

@@ -143,7 +143,7 @@ const Headers = ({ collection, folder }) => {
         onColumnWidthsChange={(widths) => handleColumnWidthsChange('folder-headers', widths)}
       />
       <div className="flex justify-end mt-2">
-        <button className="text-link select-none" onClick={toggleBulkEditMode}>
+        <button className="text-link select-none" data-testid="bulk-edit-toggle" onClick={toggleBulkEditMode}>
           Bulk Edit
         </button>
       </div>

packages/bruno-app/src/components/FolderSettings/Script/index.js

@@ -110,7 +110,7 @@ const Script = ({ collection, folder }) => {
           </TabsTrigger>
         </TabsList>
 
-        <TabsContent value="pre-request" className="mt-2">
+        <TabsContent value="pre-request" className="mt-2" data-testid="folder-pre-request-script-editor">
           <CodeEditor
             ref={preRequestEditorRef}
             collection={collection}
@@ -126,7 +126,7 @@ const Script = ({ collection, folder }) => {
           />
         </TabsContent>
 
-        <TabsContent value="post-response" className="mt-2">
+        <TabsContent value="post-response" className="mt-2" data-testid="folder-post-response-script-editor">
           <CodeEditor
             ref={postResponseEditorRef}
             collection={collection}

packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/index.js

@@ -17,7 +17,7 @@ const FormUrlEncodedParams = ({ item, collection }) => {
   const dispatch = useDispatch();
   const { storedTheme } = useTheme();
   const wrapperRef = useRef(null);
-  usePersistedContainerScroll(wrapperRef, '.flex-boundary', `request-body-scroll-${item.uid}-formUrlEncoded`);
+  usePersistedContainerScroll(wrapperRef, '.flex-boundary', `request-body-formUrlEncoded-scroll-${item.uid}`);
   const tabs = useSelector((state) => state.tabs.tabs);
   const activeTabUid = useSelector((state) => state.tabs.activeTabUid);
   const params = item.draft ? get(item, 'draft.request.body.formUrlEncoded') : get(item, 'request.body.formUrlEncoded');

packages/bruno-app/src/components/RequestPane/MultipartFormParams/index.js

@@ -22,7 +22,7 @@ const MultipartFormParams = ({ item, collection }) => {
   const dispatch = useDispatch();
   const { storedTheme } = useTheme();
   const wrapperRef = useRef(null);
-  usePersistedContainerScroll(wrapperRef, '.flex-boundary', `request-body-scroll-${item.uid}-multipartForm`);
+  usePersistedContainerScroll(wrapperRef, '.flex-boundary', `request-body-multipartForm-scroll-${item.uid}`);
   const tabs = useSelector((state) => state.tabs.tabs);
   const activeTabUid = useSelector((state) => state.tabs.activeTabUid);
   const params = item.draft ? get(item, 'draft.request.body.multipartForm') : get(item, 'request.body.multipartForm');

packages/bruno-app/src/components/RequestPane/RequestBody/index.js

@@ -18,7 +18,7 @@ const RequestBody = ({ item, collection }) => {
   const bodyMode = item.draft ? get(item, 'draft.request.body.mode') : get(item, 'request.body.mode');
   const { displayedTheme } = useTheme();
   const preferences = useSelector((state) => state.app.preferences);
-  const bodyScroll = usePersistedEditorScroll(editorRef, `request-body-scroll-${item.uid}-${bodyMode}`);
+  const bodyScroll = usePersistedEditorScroll(editorRef, `request-body-${bodyMode}-scroll-${item.uid}`);
 
   const onEdit = (value) => {
     dispatch(

packages/bruno-app/src/components/RequestPane/RequestHeaders/index.js

@@ -149,7 +149,7 @@ const RequestHeaders = ({ item, collection, addHeaderText }) => {
         onColumnWidthsChange={(widths) => handleColumnWidthsChange('request-headers', widths)}
       />
       <div className="flex justify-end mt-2">
-        <button className="btn-action text-link select-none" onClick={toggleBulkEditMode}>
+        <button className="btn-action text-link select-none" data-testid="bulk-edit-toggle" onClick={toggleBulkEditMode}>
           Bulk Edit
         </button>
       </div>

packages/bruno-app/src/components/RequestPane/Script/index.js

@@ -103,7 +103,7 @@ const Script = ({ item, collection }) => {
           </TabsTrigger>
         </TabsList>
 
-        <TabsContent value="pre-request" className="mt-2" dataTestId="pre-request-script-editor">
+        <TabsContent value="pre-request" className="mt-2" data-testid="pre-request-script-editor">
           <CodeEditor
             ref={preRequestEditorRef}
             collection={collection}
@@ -120,7 +120,7 @@ const Script = ({ item, collection }) => {
           />
         </TabsContent>
 
-        <TabsContent value="post-response" className="mt-2" dataTestId="post-response-script-editor">
+        <TabsContent value="post-response" className="mt-2" data-testid="post-response-script-editor">
           <CodeEditor
             ref={postResponseEditorRef}
             collection={collection}