webpro / reveal-md

reveal.js on steroids! Get beautiful reveal.js presentations from any Markdown file
MIT License
3.69k stars 415 forks source link

Code formatting turns exactly 12 spaces into a line break #476

Open detly opened 6 months ago

detly commented 6 months ago

reveal-md version: 6.0.1 npm version: 10.2.4 node version: v20.11.0

Create a single file test.md containing only:

```text
a            b


This is rendered as:

![Screenshot from 2024-02-20 06-39-01](https://github.com/webpro/reveal-md/assets/311239/444a7393-cd67-4205-9bcc-1dbff9276d35)

It doesn't matter what's at the start of the line, or what `a` and `b` are, or what the syntax is. It's not regular wrapping, because adding a `&nbsp;` halfway makes it all sit on one line. Inspecting the source shows that the text itself contains a raw line break ie. it's not a `<br>` in the HTML.

I was unable to reproduce this in vanilla reveal.js, but I am not super familiar with it so maybe that was just me.
cspindler commented 5 months ago

I noticed that behaviour as well, as it breaks table formatting pretty badly:

|          |                                             |
| -------- | ------------------------------------------- |
| period   | mornings (4-7 UTC) and evenings (19-23 UTC) |
| interval | 1 minute                                    |
| duration | 55 seconds                                  |
| SR       | 250 kHz (for calls up to 125 kHz)           |

renders fine on github and other markdown renderers:

period mornings (4-7 UTC) and evenings (19-23 UTC)
interval 1 minute
duration 55 seconds
SR 250 kHz (for calls up to 125 kHz)

ends up rendered by reveal-md like this:

|          |
                               |
| -------- | ------------------------------------------- |
| period   | mornings (4-7 UTC) and evenings (19-23 UTC) |
| interval | 1 minute
                      |
| duration | 55 seconds
                    |
| SR       | 250 kHz (for calls up to 125 kHz)           |

if I reduce the number consecutive spaces to <= 13, reveal-md renders the table correctly:

|          |             |
| -------- | ------------------------------------------- |
| period   | mornings (4-7 UTC) and evenings (19-23 UTC) |
| interval | 1 minute             |
| duration | 55 seconds             |
| SR       | 250 kHz (for calls up to 125 kHz)           |
webpro commented 5 months ago

Could someone maybe try the same without reveal-md, but with only reveal.js?

cspindler commented 5 months ago

Tested with fresh clone of reveal.js (421da63750b3932e838efaf3bbf2c45df56f760e) and the following code:

<!-- head as seen in reveal.js repo index.html -->
<body>
  <div class="reveal">
    <div class="slides">
      <section data-markdown>
        <textarea data-template>
          |          |                                             |
          | -------- | ------------------------------------------- |
          | period   | mornings (4-7 UTC) and evenings (19-23 UTC) |
          | interval | 1 minute                                    |
          | duration | 55 seconds                                  |
          | SR       | 250 kHz (for calls up to 125 kHz)           |
        </textarea>
      </section>
    </div>
  </div>
  <script src="dist/reveal.js"></script>
<!-- rest as seen in reveal.js repo index.html -->

works as expected

MartenBE commented 1 day ago

I've also hit this bug. Really weird, it breaks my tables. No errors in console.

|                 | In rust      | Tijdens verzenden | Tijdens verwerking |
| --------------- | ------------ | ----------------- | ------------------ |
| Confidentiality | Data veilig? | Data veilig?      | Data veilig?       |
| Integrity       | Data veilig? | Data veilig?      | Data veilig?       |
| Availability    | Data veilig? | Data veilig?      | Data veilig?       |

Gives

<section data-markdown="" data-markdown-parsed="true" style="top: 258.5px; display: block;" class="present"><p>|</p>
<p>| In rust      | Tijdens verzenden | Tijdens verwerking |
| --------------- | ------------ | ----------------- | ------------------ |
| Confidentiality | Data veilig? | Data veilig?      | Data veilig?       |
| Integrity       | Data veilig? | Data veilig?      | Data veilig?       |
| Availability    | Data veilig? | Data veilig?      | Data veilig?       |</p>
</section>

But with less than 12 spaces:

|  | In rust      | Tijdens verzenden | Tijdens verwerking |
| --------------- | ------------ | ----------------- | ------------------ |
| Confidentiality | Data veilig? | Data veilig?      | Data veilig?       |
| Integrity       | Data veilig? | Data veilig?      | Data veilig?       |
| Availability    | Data veilig? | Data veilig?      | Data veilig?       |

Gives

<section data-markdown="" data-markdown-parsed="true" style="top: 379.5px; display: block;" class="present"><table>
<thead>
<tr>
<th></th>
<th>In rust</th>
<th>Tijdens verzenden</th>
<th>Tijdens verwerking</th>
</tr>
</thead>
<tbody><tr>
<td>Confidentiality</td>
<td>Data veilig?</td>
<td>Data veilig?</td>
<td>Data veilig?</td>
</tr>
<tr>
<td>Integrity</td>
<td>Data veilig?</td>
<td>Data veilig?</td>
<td>Data veilig?</td>
</tr>
<tr>
<td>Availability</td>
<td>Data veilig?</td>
<td>Data veilig?</td>
<td>Data veilig?</td>
</tr>
</tbody></table>
</section>

as expected.

MartenBE commented 23 hours ago

@webpro I could (kinda) reproduce this in reveal.js, so I created an issue upstream: https://github.com/hakimel/reveal.js/issues/3671