[bug ?] A syntax error in a css stylesheet can break the whole wiki - is this normal behavior?

I recently encountered a “bug” where new stylesheets I created were having no effect whatsoever. After hours of trial/errors, I eventually find out that I accidentally added a $:/tags/Stylesheet tag on a tiddler with a css variable not enclosed in curly brackets. Same behavior with single curly bracket.

It seems like the CSS parsing fail for ALL the following stylesheet (in the order displayed by the dropdown of the tag).

This can break a whole wiki if the field list-before of such a tiddler is blank. This behavior is present on both the current version and the pre-release.

IMO the parser should close open brackets (by default) to prevent that. What do you think?

If you want to break your wiki, import this tiddler :

This tiddler will break your wiki.tid (137 Bytes)

Even the safe mode cant restore the correct CSS behavior.

EDIT : I opened an issue on github, let me know if I should close it.

EDIT2 : You can find broken stylesheets with this wikitext :

<style>.debug{display: block;}</style>
<$list filter="[tag[$:/tags/Stylesheet]]" counter=nth>
<style>
{{!!text}}
.debug-<<nth>>{display:none;}
</style>
<$link class={{{[[debug-]][<nth>][[ debug]]+[join[]]}}}/>
</$list>
2 Likes

I think, the issue is valid but i don’t have an idea about an easy fix atm.

TiddlyWiki allows us to dynamically create stylesheets but it doesn’t do a “sanity check”. The resulting code is passed on directly to the browser, which does the “real parsing”.

The default behaviour of the browsers CSS parser is, if there is a syntax error it stops parsing at that position. Because the rest of the “CSS content” is probably broken.

Since “list-before” is empty it will be listed as the frist stylesheet to be used … Since it is broken the rest will not be activated anymore. …

The code in the core, that produces the <style> tag concatenates all tiddlers tagged $:/tags/Stylesheet into 1 style-tag. … So if 1 tiddler contains invalid syntax, the content below it “broken” too.

We may be able to create 1 style-tag per CSS tiddler. So only 1 tiddler would be “broken” …

This behaviour will still create issues, that will need hours to be found, since browsers “fail silently”. … But it won’t break the whole wiki. …

There may be some error messages in the browser dev-console F12 … But that’s not where “standard users” look at …

Some experimenting will be needed. I’ll have a closer look and give feedback here or / and at GitHub

1 Like

I think that’s the best approach. I’ve commented on the GitHub issue.