I have been working on application that would alow user to get element selector out of HTML structure. I am using CodeMirror which I think would with some clever logic allow this. I tried to use "edit/matchtags.js" addon. But for love of god I am unable to run it in React 18 with CodeMirror v6
Now what the application looks like. User sets URL in the application. HTML of said website is then showed to user in CodeMirror form:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</div>
</body>
</html>
Now I would like to be able to get selector path of clicked element. In combination with "edit/matchtags.js" I dont think this would be a problem. Because it wraps selected element in special class, which could be found using jquery dom methods. But as I said, for some reason I am unable to run the addon with CodeMirror v6.
After clicking certain element the user would get for example following:
body > div > p
Or do you have any better idea to achieve this?
Regards, Haggerman