Description
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'm using version 1.0.0-alpha-99.
I try to replace CSS variables with actual value in a html file (I have a pdf export tool that can't handle css variables in the pre-generated html). I'm playing with AngleSharp(.Css) to parse the html file and see what can I do with it. First of all, I parsed the html content and checked the parsed style objects.
I noticed, that if a variable is used in a shorthand css property, Value is empty in all the longhand properties, even the simple ones (e.g 1px or solid, etc). If I parse a single css property (one of the longhand) with variable, Value is set correctly.
Sorry, if this is not a bug, but by design or if I'm using AngleSharp in the wrong way. I'm really new to it and I might have missed something.
Thanks for help!
Steps to Reproduce
new AngleSharp.Css.Parser.CssParser(new AngleSharp.Css.Parser.CssParserOptions() { IsIncludingUnknownDeclarations = true, IsIncludingUnknownRules = true, IsToleratingInvalidSelectors = true }).ParseDeclaration("border-bottom: 1px solid var(--pale-grey);")
new AngleSharp.Css.Parser.CssParser(new AngleSharp.Css.Parser.CssParserOptions() { IsIncludingUnknownDeclarations = true, IsIncludingUnknownRules = true, IsToleratingInvalidSelectors = true }).ParseDeclaration("border-bottom-color: var(--pale-grey);")
The same happens if I examine a document loaded with the following code, that contains a <style> node with similar css rules.
var config = AngleSharp.Configuration.Default.WithDefaultLoader(new LoaderOptions { IsResourceLoadingEnabled = true }).WithCss();
var context = BrowsingContext.New(config);
var document = context.OpenAsync(res => res.Content(File.ReadAllText(@"sample.html")));
Expected Behavior
longhand properties:
Name Value
border-bottom-width 1px
border-bottom-style solid
border-bottom-color var(--pale-grey)
single property:
Name Value
border-bottom-color var(--pale-grey)
Actual Behavior
Name Value
border-bottom-width
border-bottom-style
border-bottom-color
single property:
Name Value
border-bottom-color var(--pale-grey)
Possible Solution / Known Workarounds
No response