Code block in table cells shows line breaks <br>

Before opening a new bug report, please search the forum for duplicates and follow the Troubleshooting Guide.

  • We only consider bugs that are reproducible in the sandbox vault or a vault with no third-party plugins/no css snippets/default theme.
  • For Linux, we only accept bug reports that are reproducible with our Appimage package under Gnome or KDE.
  • Developer issues with the API should go here

Once you’ve done the above, delete everything above this line.

Steps to reproduce

  1. Insert table
  2. in any cell place code block
  3. navigate out of cell and all line breaks show in HTML

Did you follow the troubleshooting guide? [Y/N]

Yes, can replicate in sandbox mode, obsidian and all plugins up to date

Expected result

line breaks hidden, same as when inside of any code block outside of a table

Actual result

line break show HTML tag
when navigating outside the code block in a cell

Environment

Sandbox
SYSTEM INFO:
Obsidian version: v1.5.3
Installer version: v1.4.13
Operating system: Windows 10 Home 10.0.22631
Login status: logged in
Catalyst license: none
Insider build toggle: off
Live preview: on
Base theme: adapt to system
Community theme: none
Snippets enabled: 0
Restricted mode: on

RECOMMENDATIONS:
none

Current setup
SYSTEM INFO:
Obsidian version: v1.5.3
Installer version: v1.4.13
Operating system: Windows 10 Home 10.0.22631
Login status: logged in
Catalyst license: none
Insider build toggle: off
Live preview: on
Base theme: adapt to system
Community theme: none
Snippets enabled: 0
Restricted mode: off
Plugins installed: 7
Plugins enabled: 7
1: Importer v1.5.6
2: Advanced URI v1.38.1
3: Editor Syntax Highlight v0.1.3
4: ReadItLater v0.4.0
5: Dataview v0.5.64
6: @ Symbol Linking v1.6.0
7: Plaintext v0.3.0

RECOMMENDATIONS:
Community plugins: for bugs, please first try updating all your plugins to latest. If still not fixed, please try to make the issue happen in the Sandbox Vault or disable community plugins.


Additional information

image

2 Likes

It’s not a bug. code blocks in cells is not a thing in markdown.

I have the same use case scenario embedding the code block (with multiple lines) into a table so that the syntax difference with example code (e.g. hello world program) for some new language can be shown in a table for easy comparison.

So far I am using the Embed files syntax (i.e. ![[XXX]]) with the code block placed into the sub-heading sections created on the same note, but the indentation spacing and the section heading is occupying the tight space in the table cell.

Therefore, it would be lovely to know that if there are some other workaround for showing the multi-line code block inside a table, thanks.

Running into this as an issue as well.

Inline code blocks (single back tick) render fine when focus is inside the cell and when focus leaves the cell.

Code blocks (triple back tick) render fine when focus is inside the cell but the rendering breaks when focus leaves the cell.

Given rendering works fine when cursor focus is in the cell and then breaks when cursor focus leaves the cell leads me to believe this may be more of a bug.

image

  • Image above cursor focus is outside the table.
  • Row 1 is inline code block, two of them in a row for sake of example. Renders fine with or without focus.
  • Row 2 is code block (multiline), does not render correctly <br>'s present when cursor focus leaves the cell.

but… move focus into the cell and code block (multiline) rendering is working (no <br> visible)

image

  • Note the cursor is now in Row 2 multiline code block and rendering is working without <br>.
1 Like

I reckon you’ve written up your examples in live preview and this is strangeness happening due to trying to introduce multiline blocks within the markdown for tables, which in general isn’t a good thing to do.

Viewing something which seems to be similar to your example in source mode looks like this:

| Entity type | VLAN                                           |
| ----------- | ---------------------------------------------- |
| Central     | `1 Default`<br>`4 Wired-public`                |
| Branch      | ```<br>1 Default<br>4 Wired-public<br>```      |

And even though live preview’s table editing feature displays it correctly when you’re inside the editing, it’s not good markdown either way.

One variant I tried which kind of displays OK (besides your first option) is to fake the output using a dataview inline query:

| Yet another | `$= dv.el("pre", "1 Default\n4 Wired-public") ` |

With this as the last line, the entire table now renders as:
image

I’m not sure what other methods there exists to get a multi-line code block into a table. I’m considering whether you could use embedding to do so, but not sure how to do that and still have it readily available for editing.