als-document 0.6.1 → 0.7.0

package/test/tests/parser-test.js

@@ -0,0 +1,99 @@
+import { HtmlParser } from '../../document.mjs'
+import SimpleTest from '../utils/als-simple-test/test.mjs'
+let {describe,it,beforeEach,runTests,expect,delay} = SimpleTest
+import html1 from '../data/html1.js'
+import html2 from '../data/html2.js'
+
+let root1 = HtmlParser.parse(html1)
+let root2 = HtmlParser.parse(html2)
+let body1 = root1.children[1].children[1]
+let head1 = root1.children[1].children[0]
+let body2 = root2.children[0].children[1]
+let head2 = root2.children[0].children[0]
+
+export default function() {
+   describe('HtmlParser tests', () => {
+      it('Parse html for html1',() => {
+         expect(root1.type).equalTo('root')
+      })
+   
+      it('Parse html for html2',() => {
+         expect(root2.type).equalTo('root')
+      })
+   
+      it('root1 element has 2 children',() => {
+         expect(root1.children.length).equalTo(2)
+      })
+      it('Check if element is right',() => {
+         expect(body1.tag).equalTo('body')
+      })
+      it('Check if element is right',() => {
+         expect(head1.tag).equalTo('head')
+      })
+      it('body element has 4 children',() => {
+         expect(body1.children.length).equalTo(4)
+      })
+      it('Read title text',() => {
+         expect(head1.children[3].children[0].text).equalTo('Document')
+      })
+      it('innerHTML',() => {
+         expect(body1.children[3].children[6].innerHTML).equalTo('tab3 content')
+      })
+      it('outerHTML',() => {
+         expect(body1.children[3].children[6].outerHTML)
+         .equalTo('<div class="tab-content p2 transition1">tab3 content</div>')
+      })
+      it('ancestors',() => {
+         expect(body1.children[3].children[6].ancestors.length).equalTo(3)
+      })
+      it('elements',() => {
+         expect(body1.children[3].elements.length).equalTo(25)
+      })
+      it('children length',() => {
+         expect(body2.children.length).equalTo(15)
+      })
+      it('id',() => {
+         expect(body1.children[3].children[1].id).equalTo('tab2')
+      })
+      it('classList',() => {
+         expect(body2.children[2].children[0].children[4].classList.length).equalTo(5)
+      })
+      it('style',() => {
+         let style = body2.children[2].children[0].children[4].style
+         expect(Object.keys(style)[0]).equalTo('marginTop')
+      })
+      it('style length',() => {
+         let style = body2.children[4].style
+         expect(Object.keys(style).length).equalTo(5)
+      })
+      it('style with multiple styles',() => {
+         let style = body2.children[4].style
+         expect(style.left).equalTo('605px')
+      })
+      it('attributs length',() => {
+         let attribs = body2.children[2].children[0].children[0].attribs
+         expect(Object.keys(attribs).length).equalTo(6)
+      })
+      it('attribute content',() => {
+         expect(body2.children[2].children[0].children[0].attribs.target).equalTo('_blank')
+      })
+      it('next',() => {
+         let {tag,id} = body2.children[2].children[0].children[0].next
+         expect(`${tag}#${id}`).equalTo('a#menuButton')
+      })
+      it('prev',() => {
+         let {tag,id} = body2.children[2].children[0].children[1].prev
+         expect(`${tag}#${id}`).equalTo('a#tryhome')
+      })
+      it('parent',() => {
+         let {tag,classList} = body2.children[2].children[0].children[1].parent
+         expect(`${tag}.${classList[0]}`).equalTo('div.w3-bar')
+      })
+      it('Single tags doesnt have children',() => {
+         expect(head2.children[1].children).isNot().defined()
+      })
+      it('Text tag doesnt have children',() => {
+         expect(head2.children[0].children[0].children).isNot().defined()
+      })
+   })
+}

package/test/tests/query-test.js

@@ -0,0 +1,71 @@
+import { Query } from '../../document.mjs'
+import SimpleTest from '../utils/als-simple-test/test.mjs'
+let {describe,it,beforeEach,runTests,expect,delay} = SimpleTest
+// import html1 from './html1.js'
+// import html2 from './html2.js'
+const q1 = 'html>body>div.tabs~.some[type $= "some"][test]>p+div>.some-id .tab-content~input[disabled] div.some'
+const s1 = Query.get(q1)[0]
+
+export default function () {
+   it('Check target',() => {
+      const expected = 'div.some'
+      let {tag,classList} = s1
+      expect(`${tag}.${classList[0]}`).equalTo(expected)
+   })
+   it('Check ancestors length',() => {
+      expect(s1.ancestors.length).equalTo(2)
+   })
+   it('Check prev group',() => {
+      const expected = s1.ancestors[0].group.split('+')[0]
+      expect(s1.ancestors[0].prev.group).equalTo(expected)
+   })
+   it('Check parents length',() => {
+      expect(s1.ancestors[0].parents.length).equalTo(1)
+   })
+   it('Check prev any, prev and classList',() => {
+      expect(s1.ancestors[0].prev.prevAny.classList[0]).equalTo('tabs')
+   })
+   it('Check attributes length',() => {
+      expect(s1.ancestors[0].prev.parents[0].attribs.length).equalTo(2)
+   })
+   it('Check attributes fn $',() => {
+      expect(s1.ancestors[0].prev.parents[0].attribs[0].check('test and some')).equalTo(true)
+   })
+   it('Check attributes fn *=',() => {
+      expect(s1.ancestors[0].prev.parents[0].attribs[0].check('some'))
+      .equalTo(true)
+   })
+   it('Check attributes fn *=',() => {
+      let s = Query.get('[test*="some value"]')[0]
+      expect(s.attribs[0].check('some value test')).equalTo(true)
+   })
+   it('Check attributes fn ~= prase instead single word',() => {
+      let s = Query.get('[test~="some value"]')[0]
+      expect(s.attribs[0].check('some value test')).equalTo(false)
+   })
+   it('Check attributes fn ~=',() => {
+      let s = Query.get('[test~="value"]')[0]
+      expect(s.attribs[0].check('some value test'))
+      .equalTo(true)
+   })
+   it('Check attributes fn ^=',() => {
+      let s = Query.get('[test^="some"]')[0]
+      expect(s.attribs[0].check('some value test'))
+      .equalTo(true)
+   })
+   it('Check attributes fn |= with few words',() => {
+      let s = Query.get('[test|="some value test"]')[0]
+      expect(s.attribs[0].check('some'))
+      .equalTo(false)
+   })
+   it('Check attributes fn |=word',() => {
+      let s = Query.get('[test|="some"]')[0]
+      expect(s.attribs[0].check('some'))
+      .equalTo(true)
+   })
+   it('Check attributes fn |=word-word',() => {
+      let s = Query.get('[test|="some"]')[0]
+      expect(s.attribs[0].check('some-value'))
+      .equalTo(true)
+   })
+}

package/test/tests/selector-test.js

@@ -0,0 +1,169 @@
+import { HtmlSelector } from '../../document.mjs'
+import SimpleTest from '../utils/als-simple-test/test.mjs'
+let {describe,it,beforeEach,runTests,expect,delay} = SimpleTest
+import html1 from '../data/html1.js'
+import html2 from '../data/html2.js'
+let $1 = new HtmlSelector(html1)
+let $2 = new HtmlSelector(html2)
+
+export default function () {
+   describe('Selector tests', () => {
+      describe('Tests for selecting single element',() => {
+         it('Get body tag from $1', () => {
+            expect( $1.$('body').tag).equalTo('body');
+         })
+         it('Get body tag from $2', () => {
+            expect( $2.$('body').tag).equalTo('body');
+         })
+         it('Get element by className from $1', () => {
+            expect( $1.$('.tabs').classList.includes('tabs')).equalTo(true);
+         })
+         it('Get element by className from $2', () => {
+            expect( $2.$('.w3-button').attribs.href)
+            .equalTo('https://www.w3schools.com');
+         })
+         it('Get element by id from $1', () => {
+            expect( $1.$('#tab3').id).equalTo('tab3');
+         })
+         it('Get element by id from $2', () => {
+            expect( $2.$('#runbtn').id).equalTo('runbtn');
+         })
+         it('Get element by attribute from $1', () => {
+            expect( $1.$('[name="css-tabs"][type="radio"][checked]').id).equalTo('tab1');
+         })
+         it('Get element by attribute from $2', () => {
+            expect( $2.$('[title="Save"]').attribs.title)
+            .equalTo('Save');
+         })
+         it('Get element by attribute name $1', () => {
+            expect( $1.$('[style]').style.display).equalTo('none');
+         })
+         it('Get element by attribute name $2', () => {
+            expect( $2.$('[class]').attribs.class).equalTo('trytopnav');
+         })
+      })
+      describe('Check attributes for single',() => {
+         it('Test includes - "*=" fro $1',() => {
+            expect( $1.$('[class*="transition1"]').innerHTML).equalTo('Tab 1')
+         })
+         it('Test starts with - "^=" fro $1',() => {
+            expect( $1.$('[class*="tab-content"]').innerHTML).equalTo('tab1 content')
+         })
+         it('Test ends with - "$=" fro $1',() => {
+            expect( $1.$('[class*="p2 transition1"]').innerHTML).equalTo('tab1 content')
+         })
+         it('Test starts with word-  "|=" fro $1',() => {
+            expect( $1.$('[name|="css"]').attribs.name).equalTo('css-tabs')
+         })
+         it('Test includes word  "~=" fro $1',() => {
+            expect($1.$('[class~="bgc-smoke"]').classList.includes('bgc-smoke')).equalTo(true)
+         })
+         it('Test includes - "*=" fro $2',() => {
+            expect( $2.$('[title*=".com"]').attribs.title).equalTo('w3schools.com Home')
+         })
+         it('Test starts with - "^=" fro $2',() => {
+            expect( $2.$('[class^="w3-right"]').attribs.class).equalTo('w3-right w3-hide-small')
+         })
+         it('Test ends with - "$=" fro $2',() => {
+            expect( $2.$('[title$="Home"]').attribs.title).equalTo('w3schools.com Home')
+         })
+         it('Test starts with word-  "|=" fro $2',() => {
+            expect( $2.$('[lang|="en"]').attribs.lang).equalTo('en-US')
+         })
+         it('Test includes word  "~=" fro $2',() => {
+            expect( $2.$('[property~="width"]').attribs.property).equalTo('og:image:width')
+         })
+      })
+      describe('Few selectors test for single',() => {
+         it('tag and attribute $1',() => {
+            expect( $1.$('input[checked]').id).equalTo('tab1')
+         })
+         it('parent tag and attribute $1',() => {
+            expect( $1.$('div.tabs>input[checked]').id).equalTo('tab1')
+         })
+         it('parent and next $1',() => {
+            expect( $1.$('div.tabs>input[checked]+input').id).equalTo('tab2')
+         })
+         it('ancestor $1',() => {
+            expect( $1.$('body [onclick*="Hello world"]').attribs.onclick.includes('this.innerHTML')).equalTo(true)
+         })
+         it('ancestor, parent and (~) $1',() => {
+            expect( $1.$('[checked]~#tab3').id).equalTo('tab3')
+         })
+         it('inner',() => {
+            expect( $1.$('[inner*="content"]').innerHTML).equalTo('tab1 content')
+         })
+         it('tag and attribute $2',() => {
+            expect( $2.$('button[onclick]').id).equalTo('runbtn')
+         })
+         it('parent tag and attribute $2',() => {
+            expect( $2.$('#container>div>span[title="Close Menu"]').innerHTML).equalTo('×')
+         })
+         it('parent and next $2',() => {
+            expect( $2.$('#container>div>span[title="Close Menu"]+div').attribs.class).equalTo('w3-bar-block')
+         })
+         it('ancestor $2',() => {
+            expect( $2.$('#container a span').innerHTML).equalTo('Change Orientation')
+         })
+         it('ancestor, parent and (~) $2',() => {
+            expect( $2.$('#container a>i~span').innerHTML).equalTo('Change Orientation')
+         })
+         it('inner',() => {
+            expect( $2.$('[inner*="Privacy"]').innerHTML).equalTo('Privacy policy')
+         })
+      })
+      describe('Select collection',() => {
+         it('Select few elements (input) $1',() => {
+            expect( $1.$$('input').length).equalTo(3)
+         })
+         it('Select few elements ([inner*=test]) $1',() => {
+            expect( $1.$$('[inner*=test]').length).equalTo(3)
+         })
+         it('Select few elements (.transition1) $1',() => {
+            expect( $1.$$('.transition1').length).equalTo(6)
+         })
+         it('Select few elements (div>.transition1) $1',() => {
+            expect( $1.$$('div>.transition1').length).equalTo(3)
+         })
+         it('Select few elements (.col5>input[checked][name^=css][type]) $1',() => {
+            expect( $1.$$('.col5>input[checked][name^=css][type]').length).equalTo(1)
+         })
+         it('Select few elements (.col5 label[for^="tab"]) $1',() => {
+            expect( $1.$$('.col5 label[for^="tab"]').length).equalTo(3)
+         })
+         it('Select few elements (.w3-button) $2',() => {
+            expect( $2.$$('.w3-button').length).equalTo(12)
+         })
+         it('Select few elements (.w3-button) $2',() => {
+            expect( $2.$$('.w3-button>img').length).equalTo(1)
+         })
+         it('Select few elements (.w3-button>img+span) $2',() => {
+            expect( $2.$$('.w3-button>img+span')[0].innerHTML).equalTo('Go to Spaces')
+         })
+         it('Select few elements (#container div) $2',() => {
+            expect( $2.$$('#container div').length).equalTo(30)
+         })
+         it('Select few elements (#container div) $2',() => {
+            expect( $2.$$('#container>div').length).equalTo(4)
+         })
+      })
+      describe('Few selectors',() => {
+         it('Select few elements (.col5 label[for^="tab"],input[checked]) $1',() => {
+            expect( $1.$$('.col5 label[for^="tab"],input[checked]').length).equalTo(4)
+         })
+         it('Select few elements ([style],[onclick]) $1',() => {
+            expect( $1.$$('[style],[onclick],[name]').length).equalTo(7)
+         })
+         it('Select few elements (#container a[title]) $2',() => {
+            expect( $2.$$('#container a[title]').length).equalTo(4)
+         })
+         it('Select few elements (div,span) $2',() => {
+            expect( $2.$$('div,span').length).equalTo(165)
+         })
+         it('Select few elements (meta[property^="og"],meta[content^="width"]) $2',() => {
+            expect( $2.$$('meta[property^="og"],meta[content^="width"]').length).equalTo(8)
+         })
+      })
+      
+   })
+}

package/test/utils/__dirname.js

@@ -0,0 +1,6 @@
+import {dirname,resolve} from 'path'
+import {fileURLToPath} from 'url'
+
+export default function(url) {
+   return dirname(fileURLToPath(url))
+}

package/test/utils/als-simple-test/test.mjs

@@ -0,0 +1,153 @@
+class SimpleTest {
+   static tests = [];
+   static beforeEachCallback;
+   static afterEachCallback;
+   static nestingLevel = 0;
+   static currentParent = [];
+   static space = ''
+   static results = {}
+   static errors = []
+   static failed = []
+   static testTitle = ''
+   static showFullError = false
+   static colors = {
+      bold:'\x1b[1m',
+      cblue:'\x1b[34m',
+      cred:'\x1b[31m',
+      cgreen:'\x1b[32m',
+      cgray:'\x1b[37m',
+      reset:'\x1b[0m'
+   }
+   static delay = (ms,toResolve) => new Promise((resolve) => {
+      setTimeout(() => {resolve(toResolve)}, ms);
+   });
+
+   static describe(title, callback) {
+      let { nestingLevel, currentParent } = SimpleTest
+      nestingLevel++;
+      currentParent.push(title);
+      callback();
+
+      currentParent.pop();
+      nestingLevel--;
+      if (nestingLevel === 0) {
+         SimpleTest.beforeEachCallback = null; // Clear beforeEachCallback after finishing the outermost describe block
+         SimpleTest.afterEachCallback = null; // Clear beforeEachCallback after finishing the outermost describe block
+      }
+   }
+
+   static beforeEach(callback) {SimpleTest.beforeEachCallback = callback;}
+
+   static afterEach(callback) {SimpleTest.afterEachCallback = callback;}
+
+   static it(title, callback) {
+      SimpleTest.tests.push({
+         titles: [...SimpleTest.currentParent, title],
+         before: SimpleTest.beforeEachCallback,
+         after:SimpleTest.afterEachCallback,
+         test: callback,
+      });
+   }
+
+   static async runTests(consoleLog=true) {
+      const {bold,cblue,cred,reset} = SimpleTest.colors
+      SimpleTest.consoleLog = consoleLog
+      let { tests,results,showFullError } = SimpleTest;
+      let previousTitles = [];
+      for(const test of tests) {
+         let curentResult = results
+         SimpleTest.space = test.titles.map(t => '  ').join('');
+         test.titles.forEach((title, index) => {
+            if(curentResult[title] == undefined) {
+               if(index == test.titles.length-1) curentResult[title] = []
+               else curentResult[title] = {}
+            }
+            curentResult = curentResult[title]
+            if(previousTitles[index] !== title) {
+               const indentation = '  '.repeat(index);
+               console.log(bold+cblue+'%s'+reset,`${indentation} ${title}`);
+               previousTitles[index] = title;
+            }
+         });
+         SimpleTest.curentResult = curentResult
+         try {
+            if (test.before) await test.before();
+            await test.test();
+            if (test.after) await test.after();
+         } catch (error) {
+            let msg = `${SimpleTest.space}${cred}Error:${reset} ${error.message}`
+            SimpleTest.errors.push(msg)
+            if(showFullError) console.log(error)
+            else console.log(msg);
+            curentResult.push({error})
+         }
+         console.log('\n');
+      }
+   }
+
+   static expect(value1) {
+      let { logResult, isEqual } = SimpleTest
+      const methods = {
+         is: (text='') => {
+            SimpleTest.testTitle = text;
+            SimpleTest.not = false
+            return methods;
+         },
+         isNot: (text='') => {
+            SimpleTest.testTitle = text;
+            SimpleTest.not = true
+            return methods;
+         },
+         equalTo: (value2) => {logResult(value1 === value2);},
+         between(value2,value3) {logResult(value1 >= value2 && value1 <= value3);},
+         below(value2) {logResult(value1 < value2);},
+         above(value2) {logResult(value1 > value2);},
+         atLeast(value2) {logResult(value1 >= value2);},
+         sameAs: (value2) => {logResult(isEqual(value1, value2));},
+         defined: () => {logResult(value1 !== undefined);},
+         matchTo(pattern) {logResult(pattern.test(new RegExp(value1)));},
+         includes(value2) {logResult(value1.includes(value2));},
+         error: () => {
+            try {value1(); return false;
+            } catch (error) {return true}
+         },
+         hasProperty: (property) => {logResult(Object.prototype.hasOwnProperty.call(value1, property));},
+      };
+      return methods;
+   }
+
+   static logResult(result) {
+      let {curentResult,testTitle,not,space,colors} = SimpleTest
+      let {cgreen,cred,cgray,reset} = colors
+      if(not) result = !result
+      curentResult.push({result:result ? true : false,testTitle,error:null})
+      SimpleTest.failed.push(testTitle)
+      const status = result ? 'Success' : 'Failed';
+      const color = result ? cgreen : cred;
+      if (testTitle == '') console.log(`${color}${space}${status}${reset}`);
+      else console.log(`${space}${color}${status}: ${testTitle ? `${cgray}${testTitle}` : ''}`+reset,);
+      SimpleTest.not = false
+      SimpleTest.testTitle = ''
+   }
+
+   static isEqual(obj1, obj2, visited = new WeakMap()) {
+      if (obj1 === obj2) return true;
+
+      if (visited.has(obj1) && visited.get(obj1) === obj2) return true;
+
+      const type1 = typeof obj1;
+      const type2 = typeof obj2;
+      if (type1 !== type2 || type1 !== 'object' || obj1 === null || obj2 === null) return false;
+      visited.set(obj1, obj2);
+
+      const keys1 = Object.keys(obj1);
+      const keys2 = Object.keys(obj2);
+      if (keys1.length !== keys2.length) return false;
+
+      for (let key of keys1) {
+         if (!keys2.includes(key) || !SimpleTest.isEqual(obj1[key], obj2[key], visited)) return false;
+      }
+      return true;
+   };
+}
+export default SimpleTest

package/test/utils/iframe.js

@@ -0,0 +1,4 @@
+export default function accessIFrameContent(id) {
+   const iframe = document.getElementById(id);
+   return iframe.contentDocument || iframe.contentWindow.document;
+}