Create list of selectors for all elements on a page

generateSelectors.js

const html = [...document.querySelectorAll("*")]
	.map(e => {
		let html = "";
		let ee = e,
			id = "",
			unique = false;
		let selectors = [];
		while (ee.parentNode && !id && !unique) {
			const classes = [...ee.classList].sort().join(".");
			const id = ee.getAttribute("id");
			let selector = "";
			selector += selector ? " > " : "";
			let subSelector = "";
			subSelector += ee.tagName.toLowerCase();
			subSelector += id ? "#" + id : "";
			subSelector += classes ? "." + classes : "";
			let matches = document.querySelectorAll(subSelector);
			let match = -1;
			[...matches].some((ele, i) => {
				if (ele === e) {
					match = i;
					return true;
				}
			});
			if (matches.length > 1) {
				subSelector += `:nth-child(${match + 1})`;
			}
			matches = document.querySelectorAll(subSelector);
			if (matches.length === 1 && matches[0] === e) {
				unique = true;
			} else {
			}
			selectors.push(subSelector);
			ee = ee.parentNode;
		}
		return `<div>${selectors.reverse().join(" > ")} {}</div>`;
	})
	.join("");
document.body.innerHTML += `<h2>Found these unique CSS selectors</h2><pre>${html}</pre>`;