FR: Make it work with <mark> attributes like <mark class="green">

[Moonbase59]

Hi there, and thanks for a useful plugin. I came across a small issue today and wonder if you’d like to fix it.

Currently, the plugin extracts highlights fine for

• double-equals highlights (==highlight==)
• text marked with <mark>something</mark>

but it will not extract highlights if the <mark> element has attributes, like <mark class="green"> or <mark style="background-color: pink;">.

Since I showed how to use "compatible" different-colour highlights in the forums today, I’d be grateful if Extract highlights could also handle these.

[akadormouse]

I'd support this request, which is needed for this to work with the Highlightr plgin.

[amitbha]

#1 seem to be supported already.

[subscribe88]

The current plugin v0.0.18 currently is not able to extract with highlights with attributes e.g. . Thank you for helping to make it work.

[amitbha]

The current plugin v0.0.18 currently is not able to extract with highlights with attributes e.g. . Thank you for helping to make it work.

I know little about js and plugin develop.
But I wrote lua script for my text editor(Textadept) to extract highlights from markdown, supporting bold, highlight, <u>, <mark>, and titles. I can share it if needed.

[xiumuyo]

I'd support this request, which is needed for this to work with the Highlightr plgin.

I also agree with this proposal, it will be great useful if it can work with the Highlightr plugin, and extract highlights like: <mark style="background: #6FE26FA6;"> text </mark>.

[Jopp-gh]

+1
This plugin is a little gem. Pity that highlightR and this plugin hasn't been produced by the same author.
Please add support for highlightR

[tekiegirl]

+1
for supporting Highlightr. Thank you.

[alxgoldstn]

I'm not well-versed in Obsidian plugins, so I'm not entirely sure how to implement this as a pull request on the GitHub repo. However, here's how you can implement this in your own plugin of extract-highlights-plugin:

1. Open your .obsidian folder in your vault, navigate to .obsidian/plugins/extract-highlights-plugin.
2. Open main.js
3. On line 457 & 458, you should see a line var removeHighlightEnd = removeHighlightStart.replace(/\<mark\>/g, "");
4. Replace with the following: var removeHighlightEnd = removeHighlightStart.replace(/\<mark(.*?)\>/g, "");
5. Find the if/else lines for re under ExtractHighlightsPlugin.prototype.processHighlights = function (view) {
6. Replace them with the following:

        if (this.settings.useBoldForHighlights) {
            re = /(==|(\<mark(.*?)(\>))|\*\*)([\s\S]*?)(==|\<\/mark\>|\*\*)/g;
        }
        else {
            re = /(==|(\<mark)(.*?)(\>))([\s\S]*?)(==|\<\/mark\>)/g;
        }

It's simple regex — this matches any character (.*?) between the <mark and closing tag >.
Should work.

[alxgoldstn]

Not sure if this is being maintained any longer; @akaalias is this project still being worked on / updated?

[AMGMNPLK]

Thank you @alxgoldstn , that worked great.

I was wondering how could we improve it even more. I was thinking on assigning to each color a different callout when pasting. Do you have any clue on how we could do it?

[magrubertone]

I'm not well-versed in Obsidian plugins, so I'm not entirely sure how to implement this as a pull request on the GitHub repo. However, here's how you can implement this in your own plugin of extract-highlights-plugin:

1. Open your `.obsidian` folder in your vault, navigate to `.obsidian/plugins/extract-highlights-plugin`.

2. Open `main.js`

3. On line 457 & 458, you should see a line `var removeHighlightEnd = removeHighlightStart.replace(/\<mark\>/g, "");`

4. Replace with the following: `var removeHighlightEnd = removeHighlightStart.replace(/\<mark(.*?)\>/g, "");`

5. Find the if/else lines for `re` under `ExtractHighlightsPlugin.prototype.processHighlights = function (view) {`

6. Replace them with the following:

        if (this.settings.useBoldForHighlights) {
            re = /(==|(\<mark(.*?)(\>))|\*\*)([\s\S]*?)(==|\<\/mark\>|\*\*)/g;
        }
        else {
            re = /(==|(\<mark)(.*?)(\>))([\s\S]*?)(==|\<\/mark\>)/g;
        }

It's simple regex — this matches any character (.*?) between the <mark and closing tag >. Should work.

This works thanks! Great stuff.

Sorting by colour would be fantastic but this covers me for now.