Visible whitespace not visible in the HTML export

Steps to reproduce

  1. Create a Dynalist node with line breaks (as created with Ctrl + Shift + Return) and whitespace for indentation at the start of the lines. No need to add any Markdown. An example node could contain this text, shown as entered in Dynalist:

    CREATE TABLE IF NOT EXISTS data (
        id    VARCHAR NULL, 
        name  VARCHAR NULL, 
        url   VARCHAR NULL, 
        count INT NULL
    );
    
  2. Observe that the whitespace used for indentation is still visible after leaving the node’s edit mode in Dynalist. This applies even though the node is just unformatted text, not using the ``` … ``` Markdown markup for code blocks.

  3. Export that node to HTML from the node’s context menu.

Expected result

The HTML export should also show the whitespace that was visible inside Dynalist, because the expectation is that it will look the same as much as possible. That would mean rendering these whitespace characters as   in HTML.

Actual result

The whitespace used for indentation is not visible. The HTML code does not contain any characters representing it, not even invisible normal blank characters. This applies for leading whitespace at the start of a line, and probably also for whitespace inside lines (but I did not test the latter).

I would guess adding white-space css property should fix things but I’m not sure how well it’s supported depending on where you’re trying to put the HTML in, but that shouldn’t be too hard to fix for the general purpose HTML use case.

Unfortunately not, because the whitespace characters are missing completely from the HTML export. I checked in the HTML source.

Oh that’s weird, I’ll investigate why that is!

I see the spacing is in the HTML export, it’s just not properly shown because of HTML space collapsing. I’ve added some CSS to make the spaces show up properly. If you paste into a text editor, they would show up.

Confirming that the spacing is in the HTML export. I just didn’t see it because in Firefox, the “Inspect Element” mode will not show it in the source even for elements that have white-space: pre-wrap set in CSS. (I guess that could be considered a bug in Firefox. It looks different in your screenshot, so probably that’s Chrome.)

Thank you for the CSS fix! :slight_smile: Couldn’t use it yet because now the exports don’t contain any CSS styling for some reason. But that’s another issue that I’ll report separately if I don’t see it reported yet.

This issue here can be considered fixed.

1 Like