search

mgedmin / restview

ReStructuredText viewer
https://pypi.python.org/pypi/restview
GNU General Public License v3.0
214 stars 34 forks source link

Using `.. contents::` causes raw CSS to show up at the top of the page when using readme-renderer >= 37.0 #65

Open barseghyanartur opened 1 year ago

barseghyanartur commented 1 year ago 
=====
Title
=====

.. contents:: Table of Contents
    :depth: 2

Heading 1
---------
Description

Heading 2
~~~~~~~~~
Long text about this

Produces weird results (on top). <body> and <style> tags not opened/closed properly - result in a broken view.

barseghyanartur commented 1 year ago

Result

Rendered HTML ```html Title pre { line-height: 125%; } td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; } span.linenos { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; } td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; } span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; } pre .hll { background-color: #ffffcc } pre { background: #ffffff; } pre .c { color: #888888 } /* Comment */ pre .err { color: #FF0000; background-color: #FFAAAA } /* Error */ pre .k { color: #008800; font-weight: bold } /* Keyword */ pre .o { color: #333333 } /* Operator */ pre .ch { color: #888888 } /* Comment.Hashbang */ pre .cm { color: #888888 } /* Comment.Multiline */ pre .cp { color: #557799 } /* Comment.Preproc */ pre .cpf { color: #888888 } /* Comment.PreprocFile */ pre .c1 { color: #888888 } /* Comment.Single */ pre .cs { color: #cc0000; font-weight: bold } /* Comment.Special */ pre .gd { color: #A00000 } /* Generic.Deleted */ pre .ge { font-style: italic } /* Generic.Emph */ pre .gr { color: #FF0000 } /* Generic.Error */ pre .gh { color: #000080; font-weight: bold } /* Generic.Heading */ pre .gi { color: #00A000 } /* Generic.Inserted */ pre .go { color: #888888 } /* Generic.Output */ pre .gp { color: #c65d09; font-weight: bold } /* Generic.Prompt */ pre .gs { font-weight: bold } /* Generic.Strong */ pre .gu { color: #800080; font-weight: bold } /* Generic.Subheading */ pre .gt { color: #0044DD } /* Generic.Traceback */ pre .kc { color: #008800; font-weight: bold } /* Keyword.Constant */ pre .kd { color: #008800; font-weight: bold } /* Keyword.Declaration */ pre .kn { color: #008800; font-weight: bold } /* Keyword.Namespace */ pre .kp { color: #003388; font-weight: bold } /* Keyword.Pseudo */ pre .kr { color: #008800; font-weight: bold } /* Keyword.Reserved */ pre .kt { color: #333399; font-weight: bold } /* Keyword.Type */ pre .m { color: #6600EE; font-weight: bold } /* Literal.Number */ pre .s { background-color: #fff0f0 } /* Literal.String */ pre .na { color: #0000CC } /* Name.Attribute */ pre .nb { color: #007020 } /* Name.Builtin */ pre .nc { color: #BB0066; font-weight: bold } /* Name.Class */ pre .no { color: #003366; font-weight: bold } /* Name.Constant */ pre .nd { color: #555555; font-weight: bold } /* Name.Decorator */ pre .ni { color: #880000; font-weight: bold } /* Name.Entity */ pre .ne { color: #FF0000; font-weight: bold } /* Name.Exception */ pre .nf { color: #0066BB; font-weight: bold } /* Name.Function */ pre .nl { color: #997700; font-weight: bold } /* Name.Label */ pre .nn { color: #0e84b5; font-weight: bold } /* Name.Namespace */ pre .nt { color: #007700 } /* Name.Tag */ pre .nv { color: #996633 } /* Name.Variable */ pre .ow { color: #000000; font-weight: bold } /* Operator.Word */ pre .w { color: #bbbbbb } /* Text.Whitespace */ pre .mb { color: #6600EE; font-weight: bold } /* Literal.Number.Bin */ pre .mf { color: #6600EE; font-weight: bold } /* Literal.Number.Float */ pre .mh { color: #005588; font-weight: bold } /* Literal.Number.Hex */ pre .mi { color: #0000DD; font-weight: bold } /* Literal.Number.Integer */ pre .mo { color: #4400EE; font-weight: bold } /* Literal.Number.Oct */ pre .sa { background-color: #fff0f0 } /* Literal.String.Affix */ pre .sb { background-color: #fff0f0 } /* Literal.String.Backtick */ pre .sc { color: #0044DD } /* Literal.String.Char */ pre .dl { background-color: #fff0f0 } /* Literal.String.Delimiter */ pre .sd { color: #DD4422 } /* Literal.String.Doc */ pre .s2 { background-color: #fff0f0 } /* Literal.String.Double */ pre .se { color: #666666; font-weight: bold; background-color: #fff0f0 } /* Literal.String.Escape */ pre .sh { background-color: #fff0f0 } /* Literal.String.Heredoc */ pre .si { background-color: #eeeeee } /* Literal.String.Interpol */ pre .sx { color: #DD2200; background-color: #fff0f0 } /* Literal.String.Other */ pre .sr { color: #000000; background-color: #fff0ff } /* Literal.String.Regex */ pre .s1 { background-color: #fff0f0 } /* Literal.String.Single */ pre .ss { color: #AA6600 } /* Literal.String.Symbol */ pre .bp { color: #007020 } /* Name.Builtin.Pseudo */ pre .fm { color: #0066BB; font-weight: bold } /* Name.Function.Magic */ pre .vc { color: #336699 } /* Name.Variable.Class */ pre .vg { color: #dd7700; font-weight: bold } /* Name.Variable.Global */ pre .vi { color: #3333BB } /* Name.Variable.Instance */ pre .vm { color: #996633 } /* Name.Variable.Magic */ pre .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */

Title

Heading 1

Description

Heading 2

Long text about this

```

pip-list

bleach          5.0.1
docutils        0.19
pip             22.2.2
Pygments        2.14.0
readme-renderer 37.3
restview        3.0.0
setuptools      62.6.0
six             1.16.0
webencodings    0.5.1
wheel           0.37.1

python 3.11.1

mgedmin commented 1 year ago

Hm, an incompatibility with some library. It works fine for me with

$ pipx runpip restview list
Package         Version
--------------- -------
bleach          5.0.0
docutils        0.18.1
pip             22.3.1
Pygments        2.12.0
readme-renderer 35.0
restview        3.0.0
setuptools      65.6.3
six             1.16.0
webencodings    0.5.1
wheel           0.38.4

image

but if I upgrade readme-renderer to 37.3, pygments to 2.12.0, and bleach to 5.0.1, I get the same dump of raw CSS at the top.

Downgrading readme-renderer back to 35.0 fixes it.

mgedmin commented 1 year ago

readme-renderer 36.0 works fine, 37.0 breaks.

mgedmin commented 1 year ago

So this is entirely my fault, since I'm subclassing readme_renderer.rst.ReadMeHTMLTranslator and assuming that it in turn subclasses docutils.writers.html4css1.HTMLTranslator.

readme-renderer 37.0 switched from subclassing html4css1.HTMLTranslator to html5_polyglot.HTMLTranslator in https://github.com/pypa/readme_renderer/commit/d853780f665817d49e5d7340cc693e31f199102d.

mgedmin commented 1 year ago

Oh oh oh the test failures I saw and fixed recently (commit 5033eacb1d5552e496a0da46f6a474a38b414f21) were probably not related to the new docutils, but to the new readme-renderer. Unfortunately it's hard to see the problem when viewing raw HTML diffs.

barseghyanartur commented 1 year ago

I confirm, that downgrading readme-renderer to 36.0 brings things back to normal.

mgedmin commented 1 year ago

I've released restview 3.0.1 to PyPI as a stopgap measure. It adds a version requirement for readme-renderer < 37.

A proper fix will take longer.