TiddlyWiki5 icon indicating copy to clipboard operation
TiddlyWiki5 copied to clipboard

[BUG] Slotted transclusion - no way to remove P tag

Open pmario opened this issue 2 years ago • 7 comments

Describe the bug

related to: Parameterised transclusions #6666

Slotted transclusion - no way to remove P tag

Expected behavior

Expected output: See no P tag

The problem is, that there is no way at the moment to get rid of the P tag.

<div class="frame">
    
        <h1>A heading</h1>
        <p>A paragraph</p>
    
</div>

To Reproduce

  • Copy the following code to a new tiddler
  • Select "raw HTML" as "preview output"
  • Preview
\function hello
<div class="frame">
    <$slot $name="greeting"/>
</div>
\end

<$transclude $variable="hello">
    <$value $name="greeting">
        <h1>A heading</h1>
        <p>A paragraph</p>
    </$value>
</$transclude >

The output is:

<p><div class="frame">
    
        <h1>A heading</h1>
        <p>A paragraph</p>
    
</div></p>

I did try it with \whitespace trim but no luck

Screenshots

image

TiddlyWiki Configuration

branch: parameterised-transclusions

Additional context

No response

pmario avatar May 11 '22 14:05 pmario

The offending parser code is this: https://github.com/Jermolene/TiddlyWiki5/blob/413dc86d05cc2d5f84b519dff43b3169db7640c8/core/modules/parsers/wikiparser/wikiparser.js#L233-L237

The comment says: // Treat it as a paragraph if we didn't find a block rule .. but ... that's not always true

pmario avatar May 11 '22 15:05 pmario

Just more info -- I did some experiments to make P tags visible with a style definition

title: p-style
tags: $:/tags/Stylesheet

p {
border: 1px solid red;
}

The ControlPanel at tiddlywiki.com looks like this:

image


With a slightly changed (3 lines of extra code) wikiparser.js function it looks as follows. There are some elements which need some margin or padding, because the invalid P tags are gone. But that's just a bit of CSS.

The "flow" behaviour of some widgets eg. the <$radio widget also changed, but that needs a bit more investigation.

image

pmario avatar May 13 '22 20:05 pmario

There is an other test, which should show us, where unnecessary elements are creeping around.

title: reveal-styles
tags: tags: $:/tags/Stylesheet

.tc-reveal {
  border: 1px solid green;
}

Many of html elements created by the reveal widget are redundant. There should be room for improvements

pmario avatar May 13 '22 20:05 pmario

Hi @pmario is this a new problem with #6666, or is this an existing problem that is more evident now? There haven't been any changes to the way that parsing is done.

Jermolene avatar May 14 '22 11:05 Jermolene

@Jermolene ... It's an existing problem, that is more evident now. ... I did try to get rid of the P tag with all the common techniques I know. \whitespace trim adding a new-line between every line of wikitext code ... But no luck.

As I did develop my "custom markup" plugin, I did a lot of single step debugging of my own parser and the core. I always came back to the code lines mentioned at: https://github.com/Jermolene/TiddlyWiki5/issues/6687#issuecomment-1123907024

I think there is a weak spot in the paragraph detection of the parser. With plain wikitext the "default" behaviour of the code is OK. But if there is an HTML tag like a DIV or any $widget in the wikitext, it adds an extra P tag ...

I'll need to do more testing, but I thin I'm on a good way.

pmario avatar May 14 '22 13:05 pmario

Hi @pmario that's what I was thinking too. There seems to be a fundamental problem: the fill widget and the slot widget will each be parsed according to the traditional inline vs. block rules determined by their context. But there's no way to ensure that they match: the transclusion might be written with a block mode slot widget, and then invoked with an inline mode fill widget.

Jermolene avatar May 14 '22 13:05 Jermolene

By the way, I'd recommend using the new wikitext test framework for this sort of thing. Here's the test I've been experimenting with for this ticket:

title: UnwantedParagraphs
description: Unwanted paragraph elements when using slot/fill
type: text/vnd.tiddlywiki-multiple
tags: [[$:/tags/wiki-test-spec]]

title: Output

\whitespace trim
\procedure hello
\whitespace trim
<div class="frame">
<$slot $name="greeting"/>
</div>
\end

<div class="tc-outer">
<$transclude $variable="hello" mode="inline">
<$fill $name="greeting">
<h1>A heading</h1>
<p>A paragraph</p>
</$fill>
</$transclude>
</div>

+
title: ExpectedResult

<p><div class="tc-outer"><div class="frame"><h1>A heading</h1><p>A paragraph</p></div></div></p>

Jermolene avatar May 14 '22 13:05 Jermolene

related: WIP Improve redundant p tags #7061

pmario avatar Apr 23 '23 18:04 pmario