GetInnerText Fails with Percent Styles

[jtleaming]

Prerequisites

• Can you reproduce the problem in a MWE?
• Are you running the latest version of AngleSharp.Css?
• Did you check the FAQs to see if that helps you?
• Are you reporting to the correct repository? (there are multiple AngleSharp libraries, e.g., AngleSharp.Xml for Xml support)
• Did you perform a search in the issues?

Description

I have a project using BUnit for unit testing components. We recently Upgraded to BUnit version 1.38.5 and .net 9. Test which were previously working started failing on calls to GetInnerText(). The method now throws this exception

System.ArgumentException
A non null render device with a font size is required to calculate em or rem units.
   at AngleSharp.Css.Values.CssLengthValue.CheckForValidRenderDimensions(IRenderDimensions renderDimensions, RenderMode mode)
   at AngleSharp.Css.Values.CssLengthValue.ToPixel(IRenderDimensions renderDimensions, RenderMode mode)
   at AngleSharp.Css.Values.CssLengthValue.ToPixel(IRenderDimensions renderDimensions)
   at AngleSharp.Css.Values.CssLengthValue.AngleSharp.Css.Dom.ICssValue.Compute(ICssComputeContext context)
   at AngleSharp.Css.Dom.CssProperty.Compute(ICssComputeContext context)
   at AngleSharp.Css.Dom.CssOmExtensions.Compute(ICssStyleDeclaration style, ICssComputeContext context)
   at AngleSharp.Css.StyleCollectionExtensions.ComputeDeclarations(IStyleCollection styles, IElement element, String pseudoSelector)
   at AngleSharp.Dom.WindowExtensions.GetComputedStyle(IWindow window, IElement element, String pseudo)
   at AngleSharp.Dom.CssApiExtensions.ComputeCurrentStyle(IElement element)
   at AngleSharp.Dom.ElementExtensions.InnerTextCollection(INode node, StringBuilder sb, Dictionary`2 requiredLineBreakCounts, ICssStyleDeclaration parentStyle)
   at AngleSharp.Dom.ElementExtensions.ItcInCssBox(ICssStyleDeclaration elementStyle, ICssStyleDeclaration parentStyle, INode node, StringBuilder sb, Dictionary`2 requiredLineBreakCounts)
   at AngleSharp.Dom.ElementExtensions.InnerTextCollection(INode node, StringBuilder sb, Dictionary`2 requiredLineBreakCounts, ICssStyleDeclaration parentStyle)
   at AngleSharp.Dom.ElementExtensions.GetInnerText(IElement element)

I wasn't totally sure if this would be a BUnit or AngleSharp bug, but since it was internal to the AngleSharp code base I thought I'd start here. If this seems more like a problem with BUnit and how it's configuring the Renderer, please let me know and I will file this bug with them instead.

I did look through their code and documentation but wasn't able to find anything explicit about this issue or setting the Renderer's size Height/Width.

Steps to Reproduce

I created a minimal project to reproduce the error.
Test

    [Fact]
    public void Test1()
    {
        var context = new TestContext();
        var subject = context.RenderComponent<Component1>();
        var text = subject.Find(".my-component").GetInnerText();
        Assert.Contains("This", text);
    }

Component

<div class="my-component" style="width: 5%">
    This component is defined in the <strong>CompLib</strong> library.
</div>

To reproduce the error I add the width: 5% style to the component. Without this the test passed just fine.

When calling Compute() the context.Device value looks like this

{
  "ViewPortWidth" : 0,
  "ViewPortHeight" : 0,
  "IsInterlaced" : false,
  "IsScripting" : true,
  "IsGrid" : false,
  "DeviceWidth" : 0,
  "DeviceHeight" : 0,
  "Resolution" : 96,
  "Frequency" : 60,
  "ColorBits" : 32,
  "MonochromeBits" : 16,
  "Category" : 0,
  "RenderWidth" : 0,
  "RenderHeight" : 0,
  "FontSize" : 16
}

Where the DeviceWidth/Height being 0 results in the bug.

Expected Behavior

The text value of the HTML element is returned.

Actual Behavior

The exception is thrown.

Possible Solution / Known Workarounds

I used TextContent instead of GetInnerText() to get the value I needed for testing.

[FlorianRappl]

I think this is rather an issue in bUnit.

A non null render device with a font size is required to calculate em or rem units.

Maybe the render device should be specified / changed to allow unit computation (i.e., having proper device dimensions).

[jtleaming]

Yeah, I don't understand enough about the inner workings of BUnit or how it integrates AngleSharp. Does it make sense that a Device would ever have a Width/Height of 0?

In particular I do not understand how BUnit, being out of context of a browser, is actually "rendering" a "device". This doesn't seem to fit in this particular use case, since the only thing rendered is a fragment of HTML.

[FlorianRappl]

If you want to render something you need some dimensions. Otherwise, what specifically do you want to render. The dimensions are quite crucial for determining the rendering / outcome.

You are not rendering a device, but instead a device is providing the context for rendering. It does not matter if you want to render a full page or just a part of it - once you render you need dimensions + potentially some other information.

Hope that makes it clear.

Does it make sense that a Device would ever have a Width/Height of 0?

No - which is why you see an error reported. 0 is the default value, which means nothing was specified. What would be a good replacement? 1? 20? 5000? Something is missing - hence it remains as 0. bUnit could set some sensible defaults, which could then (in edge case scenarios) been overwritten.