[editor_custom_stylesheet] Del/Backspace to delete a div (visual line break) adds span element that adds white background

[ijgnd]

affected addon: editor_custom_stylesheet

ankiweb link

Edit: This is a well known problem and there is a fix, see the my first answer below.

Prerequisite checklist

• [x] In case of a bug: Have you tried restarting Anki?
• [x] Are you running the latest version of the add-on? Have you redownloaded the add-on from AnkiWeb to make sure?
• [x] Did you check the add-on description on AnkiWeb for known issues?
• [x] Did you perform a cursory search through existing issue reports?

What is the problem you would like to see fixed

How can we reproduce the problem?

1. Use Anki 2.1.11 or the latest version (380d59f from 2019-04-10)
2. Install Customize Editor Stylesheet from ankiweb, version that was uploaded on 2018-09-05.
3. Create a new profile
4. Put a file _editor.css into your media.collection folder with this content:

.field {
background: #cad7ff ! important;
}

If I don't use ! important the styling is not applied. I can reproduce the bug with the general background and the more special background-color. I can reproduce this bug with different background color combinations. If I use #ffffff the span element is not added and there is no bug. But even #fffffe triggers this bug. 5. Restart Anki and go to the Add window. Enter the html source code a<div>b</div> into an empty field (type "a", press "Enter", type "b"). 6. Put the cursor behind "a" and press "del" or put the cursor before "b" and press "backspace". 7. Now the html source code looks like this:

a<span style="background-color: rgb(255, 255, 255);">b</span>

8. To make sure it's the add-on: In the main window switch off the styling via Tools - "Custom Editor Styling". Then del or backspace don't change the html source of a field.

Reproducible?: YES

Version information

Anki: Version 2.1.11 (3cf770c7), Qt 5.12.1 PyQt 5.11.3 System Windows 10(1809)

[ijgnd]

For me this issue has been solved by copying over a function from the night-mode add-on.

Details: There is a related night-mode issue Deleting a line break in the Add Note dialog causes the next line to have white background. There are several commits related to this bug (see here) and now there is a 80line function background_bug_workaround. Copying this function over fixes the problem for me.

The night mode author made a thread on ankiweb which has been closed as wontfix (because the issue only occurs with add-ons).

If this bug didn't exist an add-on to style your fields in 2.1 would no longer be necessary: In contrast to 2.0 there is a user editable text file web/editor.css. The add-on is just more comfortable if you use Anki on multiple PCs and if you sometimes update Anki. Also the add-on night-mode does no longer use the variable nm_state_on which this add-on checks. Apart from the workaround for the white background color bug this add-on is necessary to style the lineedit where you enter tags.

[glutanimate]

Thanks for another detailed report, @ijgnd. I'll try to look into this soon.