Fixes the test errors

- Upgrades jest version to 29.7
- We were getting errors related to the new emmetio import. This is because emmetio formerly compiled to both commonJS and ES modules but now only compileds to ES modules. By default, Babel will ignore node_modules, but Jest does not support ES modules out of the box (only commonJS), so we add a custom transformIgnorePatterns so that Babel knows to transform emmetio to commonJS in the jest environment.

Author: khanniie

.babelrc

@@ -62,6 +62,15 @@
           }
         ]
       ]
+    },
+    "test": {
+      "plugins": [
+        "babel-plugin-styled-components"
+      ],
+        "presets": [
+        "@babel/preset-react",
+        ["@babel/preset-env", {"modules": "cjs"}]
+      ]
     }
   },
   "plugins": [

client/modules/IDE/components/Editor/index.jsx

@@ -678,7 +678,7 @@ const Editor = (props) => {
                 <Timer />
               </div>
             </div>
-            <div
+            <article
               ref={editorRef}
               className={classNames('editor-holder', {
                 'editor-holder--hidden': file.fileType === 'folder' || file.url

client/modules/IDE/components/EditorAccessibility.unit.test.jsx

@@ -8,11 +8,7 @@ describe('<EditorAccessibility />', () => {
   it('renders empty message with no lines', () => {
     render(<EditorAccessibility lintMessages={[]} currentLine={0} />);
 
-    expect(
-      screen.getByRole('listitem', {
-        description: 'There are no lint messages'
-      })
-    ).toBeInTheDocument();
+    expect(screen.getByText(/there are no lint messages/i)).toBeInTheDocument();
   });
 
   it('renders lint message', () => {

client/modules/IDE/components/Header/__snapshots__/Nav.unit.test.jsx.snap

@@ -209,7 +209,7 @@ exports[`Nav renders dashboard version for mobile 1`] = `
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 0.16666666666666666rem;
-  box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px, rgba(60,64,67,0.15) 0px 1px 3px 1px;
+  box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 1px 3px 1px;
   min-width: 10rem;
   border-radius: 0.16666666666666666rem;
 }
@@ -323,7 +323,7 @@ exports[`Nav renders dashboard version for mobile 1`] = `
             >
               <test-file-stub
                 aria-hidden="true"
-                classname="sc-fujyAs cSTVlM"
+                classname="icons__StyledIcon-sc-xmer15-0 dStXqm"
                 focusable="false"
               />
             </button>
@@ -339,7 +339,7 @@ exports[`Nav renders dashboard version for mobile 1`] = `
           >
             <test-file-stub
               aria-hidden="true"
-              classname="sc-iqAclL iOZiVo"
+              classname="icons__StyledIcon-sc-xmer15-0 dStXqm"
               focusable="false"
             />
           </button>
@@ -910,7 +910,7 @@ exports[`Nav renders editor version for mobile 1`] = `
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 0.16666666666666666rem;
-  box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px, rgba(60,64,67,0.15) 0px 1px 3px 1px;
+  box-shadow: rgba(60,64,67,0.3) 0px 1px 2px 0px,rgba(60,64,67,0.15) 0px 1px 3px 1px;
   min-width: 10rem;
   border-radius: 0.16666666666666666rem;
 }
@@ -1024,7 +1024,7 @@ exports[`Nav renders editor version for mobile 1`] = `
             >
               <test-file-stub
                 aria-hidden="true"
-                classname="sc-fujyAs cSTVlM"
+                classname="icons__StyledIcon-sc-xmer15-0 dStXqm"
                 focusable="false"
               />
             </button>
@@ -1040,7 +1040,7 @@ exports[`Nav renders editor version for mobile 1`] = `
           >
             <test-file-stub
               aria-hidden="true"
-              classname="sc-iqAclL iOZiVo"
+              classname="icons__StyledIcon-sc-xmer15-0 dStXqm"
               focusable="false"
             />
           </button>