@cocreate/utils 1.1.36 → 1.2.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [1.2.0](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.1.36...v1.2.0) (2021-10-29)
+
+
+### Features
+
+* cssPath and domParser ([25c5088](https://github.com/CoCreate-app/CoCreate-utils/commit/25c508855c663f5e2f64596549d1eccb14eb4292))
+
 ## [1.1.36](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.1.35...v1.1.36) (2021-10-17)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/utils",
-  "version": "1.1.36",
+  "version": "1.2.0",
   "description": "A simple utils component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
   "keywords": [
     "utils",

package/src/index.js

@@ -12,34 +12,82 @@ export function parseTextToHtml(text) {
   else return doc.body.children[0];
 }
 
-export function cssPath(node) {
-  let pathSplits = [];
-  do {
-    if (!node || !node.tagName) return false;
-    let pathSplit = node.tagName.toLowerCase();
-    if (node.id && node.tagName !== "BODY") pathSplit += "#" + node.id;
+export function cssPath(node, container) {
+    let pathSplits = [];
+    do {
+        if (!node || !node.tagName) return false;
+        let pathSplit = node.tagName.toLowerCase();
+        if (node.id) pathSplit += "#" + node.id;
 
-    if (node.classList.length && node.tagName !== "BODY") {
-      node.classList.forEach((item) => {
-        if (item.indexOf(":") === -1) pathSplit += "." + item;
-      });
-    }
+        if (node.classList.length) {
+            node.classList.forEach((item) => {
+                if (item.indexOf(":") === -1) pathSplit += "." + item;
+            });
+        }
 
-    if (node.tagName !== "BODY" && node.parentNode) {
-      let index = Array.prototype.indexOf.call(
-        node.parentNode.children,
-        node
-      );
-      pathSplit += `:nth-child(${index + 1})`;
-    }
+        if (node.parentNode) {
+            let index = Array.prototype.indexOf.call(
+                node.parentNode.children,
+                node
+            );
+            pathSplit += `:nth-child(${index + 1})`;
+        }
+
+        pathSplits.unshift(pathSplit);
+        node = node.parentNode;
+        if (node.tagName == "HTML" || node.nodeName == "#document" || node.hasAttribute('contenteditable'))
+        	node = '';
+    } while (node);
+    return pathSplits.join(" > ");
+}
+
+export function domParser(str) {
+    let mainTag = str.match(/\<(?<tag>[a-z0-9]+)(.*?)?\>/).groups.tag;
+    if (!mainTag)
+        throw new Error('find position: can not find the main tag');
 
-    pathSplits.unshift(pathSplit);
-    node = node.parentNode;
-  } while (node.tagName !== "HTML");
+    let doc;
+    switch (mainTag) {
+        case 'html':
+            doc = new DOMParser().parseFromString(str, "text/html");
+            return doc.documentElement;
+        case 'body':
+            doc = new DOMParser().parseFromString(str, "text/html");
+            return doc.body;
+        case 'head':
+            doc = new DOMParser().parseFromString(str, "text/html");
+            return doc.head;
 
-  return pathSplits.join(" > ");
+        default:
+            let con = document.createElement('div');
+            con.innerHTML = str;
+            return con;
+    }
+}
+
+export function queryFrameSelector(selector) {
+		if(selector.indexOf(';') !== -1) {
+			let [frameSelector, target] = selector.split(';');
+			let frame = document.querySelector(frameSelector);
+			if (frame) {
+			 	let Document = frame.contentDocument;
+			 	let elements = Document.querySelectorAll(target);
+			 	return elements;
+			}
+		}
 }
 
+export function queryFrameSelectorAll(selector) {
+		if(selector.indexOf(';') !== -1) {
+			let [frameSelector, target] = selector.split(';');
+			let frame = document.querySelector(frameSelector);
+			if (frame) {
+			 	let Document = frame.contentDocument;
+			 	let element = Document.querySelector(target);
+			 	return element;
+			}
+		}
+}
 // export function computeStyles(el, properties) {
 //   let computed = window.getComputedStyle(el);
 //   let result = {};
@@ -64,5 +112,6 @@ export function cssPath(node) {
 export default {
   parseTextToHtml,
   getAttributes,
-  cssPath
+  cssPath,
+  domParser
 };