fix: UTs

Author: kobenguyent

package.json

@@ -135,6 +135,7 @@
     "apollo-server-express": "2.25.3",
     "chai-as-promised": "7.1.2",
     "chai-subset": "1.6.0",
+    "cheerio": "^1.0.0",
     "contributor-faces": "1.1.0",
     "documentation": "12.3.0",
     "electron": "31.3.1",

test/unit/html_test.js

@@ -5,8 +5,7 @@ let expect
 import('chai').then((chai) => {
   expect = chai.expect
 })
-const xpath = require('xpath')
-const Dom = require('@xmldom/xmldom').DOMParser
+const cheerio = require('cheerio')
 const { scanForErrorMessages, removeNonInteractiveElements, minifyHtml, splitByChunks } = require('../../lib/html')
 
 const opts = {
@@ -53,29 +52,31 @@ describe('HTML module', () => {
 
   describe('#removeNonInteractiveElements', () => {
     it('should cut out all non-interactive elements from GitHub HTML', async () => {
-      // Call the function with the loaded HTML
       html = fs.readFileSync(path.join(__dirname, '../data/github.html'), 'utf8')
       const result = removeNonInteractiveElements(html, opts)
-      let doc = new Dom().parseFromString(result)
-      const nodes = xpath.select('//input[@name="q"]', doc)
+
+      let $ = cheerio.load(result)
+
+      const nodes = $('input[name="q"]')
       expect(nodes).to.have.length(1)
       expect(result).not.to.include('Let’s build from here')
+
       const minified = await minifyHtml(result)
-      doc = new Dom().parseFromString(minified)
-      const nodes2 = xpath.select('//input[@name="q"]', doc)
+      $ = cheerio.load(minified)
+
+      const nodes2 = $('input[name="q"]')
       expect(nodes2).to.have.length(1)
     })
 
-    it('should keep interactive html elements', () => {
+    it('should keep interactive HTML elements', () => {
       html = `
         <div id="onetrust-pc-sdk" class="otPcTab ot-hide ot-fade-in" lang="en" aria-label="Preference center" role="region">
         <div role="alertdialog" aria-modal="true" aria-describedby="ot-pc-desc" style="height: 100%;" aria-label="Privacy Preference Center">
         <!-- pc header --><div class="ot-pc-header" role="presentation">
         <div class="ot-title-cntr">
         <h2 id="ot-pc-title">Privacy Preference Center</h2>
         <div class="ot-close-cntr">
-        <button id="close-pc-btn-handler" class="ot-close-icon" aria-label="Close">
-        </button>
+        <button id="close-pc-btn-handler" class="ot-close-icon" aria-label="Close"></button>
         </div>
         </div>
         </div>`
@@ -88,8 +89,7 @@ describe('HTML module', () => {
       <ul>
         <li>
           <div class="flex">
-            <button class="hamburger hamburger--arrowalt outline-none focus:outline-none
-                " style="line-height: 0; margin-top: 3px; margin-bottom: 3px;" type="button">
+            <button class="hamburger hamburger--arrowalt outline-none focus:outline-none" style="line-height: 0; margin-top: 3px; margin-bottom: 3px;" type="button">
               <span class="hamburger-box">
                 <span class="hamburger-inner"></span>
               </span>
@@ -98,11 +98,11 @@ describe('HTML module', () => {
         </li>
         <li>
         <a id="ember6" class="ember-view flex items-center" href="/projects/codeceptjs-cucumber/runs" aria-describedby="ember7-popper">
-          <svg class="md-icon md-icon-play-circle-outline " width="30" height="30" viewBox="0 0 24 24" role="img">
-      <path d="aaaa">aaa</path>
-</svg>
-</a>
-      </li>
+          <svg class="md-icon md-icon-play-circle-outline" width="30" height="30" viewBox="0 0 24 24" role="img">
+            <path d="aaaa">aaa</path>
+          </svg>
+        </a>
+        </li>
       </ul>
     </div>`
       const result = await minifyHtml(removeNonInteractiveElements(html, opts))
@@ -113,55 +113,42 @@ describe('HTML module', () => {
     })
 
     it('should cut out all non-interactive elements from HTML', () => {
-      // Call the function with the loaded HTML
       html = fs.readFileSync(path.join(__dirname, '../data/checkout.html'), 'utf8')
       const result = removeNonInteractiveElements(html, opts)
       expect(result).to.include('Name on card')
       expect(result).to.not.include('<script')
     })
 
     it('should allow adding new elements', () => {
-      const html = '<div><h6>Hey</h6></div>'
-
-      const result = removeNonInteractiveElements(html, {
-        textElements: ['h6'],
-      })
-
+      const html = '<div><h6>Hey</h6></div>';
+      const result = removeNonInteractiveElements(html, { textElements: ['h6'] })
       expect(result).to.include('<h6>Hey</h6>')
     })
 
     it('should cut out all non-interactive elements from GitLab HTML', () => {
-      // Call the function with the loaded HTML
       html = fs.readFileSync(path.join(__dirname, '../data/gitlab.html'), 'utf8')
-      // console.log(html);
       const result = removeNonInteractiveElements(html, opts)
-
       result.should.include('Get free trial')
       result.should.include('Sign in')
       result.should.include('<button')
-      const doc = new Dom().parseFromString(result)
-      const nodes = xpath.select('//input[@placeholder="Search"]', doc)
+
+      const $ = cheerio.load(result)
+      const nodes = $('input[placeholder="Search"]')
       expect(nodes).to.have.length(1)
     })
 
     it('should cut out and minify Testomatio HTML', () => {
-      // Call the function with the loaded HTML
       html = fs.readFileSync(path.join(__dirname, '../data/testomat.html'), 'utf8')
-      // console.log(html);
       const result = removeNonInteractiveElements(html, opts)
       result.should.include('<svg class="md-icon md-icon-check-bold')
-      // console.log(await minifyHtml(result));
     })
   })
 
   describe('#splitByChunks', () => {
-    it('should cut long htmls into chunks and add paths into them', () => {
-      // Call the function with the loaded HTML
+    it('should cut long HTMLs into chunks and add paths into them', () => {
       html = fs.readFileSync(path.join(__dirname, '../data/github.html'), 'utf8')
       const result = splitByChunks(html, 10000)
       expect(result).to.have.length(21)
-      // console.log(result[10])
-      // expect(result[10].startsWith('<div data-turbo-body=""')).to.be.true;
       for (const chunk of result) {
         expect(chunk.startsWith('<')).to.be.true
       }

test/unit/locator_test.js

@@ -197,7 +197,7 @@ const xml = `<body>
 
 describe('Locator', () => {
   beforeEach(() => {
-    doc = new DOMParser().parseFromString(xml, 'application/xhtml+xml')
+    doc = new DOMParser().parseFromString(xml, 'text/xml')
   })
 
   describe('constructor', () => {