Extends Verify with Html verification utilities via AngleSharp.
See Milestones for release notes.
Entity Framework Extensions is a major sponsor and is proud to contribute to the development this project.
Extends Verify to allow comparison of htm and html files via AngleSharp.
Call VerifyAngleSharpDiffing.Initialize() once at assembly load time.
Initialize takes an optional Action<IDiffingStrategyCollection> to control settings at a global level:
[ModuleInitializer]publicstaticvoidInit()=>VerifyAngleSharpDiffing.Initialize();Given an existing verified file:
<!DOCTYPE html><html><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>And a test:
[Test]publicTaskSample(){varhtml=""" <!DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html> """;returnVerify(html,"html");}Note that the input html differs from the verified html, but not in a semantically significant way. Hence this test will pass.
If the comparison fails, the resulting differences will be included in the test result displayed to the user.
For example if, in the above html, <h1>My First Heading</h1> changes to <h1>First Heading</h1> then the following will be printed in the test results:
Comparer result:
* Node Diff
Path: h1(0) > #text(0)
Received: First Heading
Verified: My First Heading
Settings can also be controlled for a specific test.
varsettings=newVerifySettings();settings.AngleSharpDiffingSettings(
action =>{staticFilterDecisionSpanFilter(inComparisonSourcesource,FilterDecisiondecision){if(source.Node.NodeName=="SPAN"){returnFilterDecision.Exclude;}returndecision;}varoptions=action.AddDefaultOptions();options.AddFilter(SpanFilter);});VerifyAngleSharpDiffing.Initialize(
action =>{staticFilterDecisionSpanFilter(inComparisonSourcesource,FilterDecisiondecision){if(source.Node.NodeName=="SPAN"){returnFilterDecision.Exclude;}returndecision;}varoptions=action.AddDefaultOptions();options.AddFilter(SpanFilter);});Given an existing verified file:
<svgversion="1.1"xmlns="http://www.w3.org/2000/svg"width="300"height="200">
<rectfill="red"width="100%"height="100%" />
<circlefill="green"cx="150"cy="100"r="80" />
<textfill="white"x="150"y="125"font-size="60"text-anchor="middle">
SVG
</text>
</svg>
And a test:
[Test]publicTaskSvgSample(){varsvg=""" <svg version="1.1" width="300" height="200" xmlns="http://www.w3.org/2000/svg"> <rect width="100%" height="100%" fill="red" /> <circle cx="150" cy="100" r="80" fill="green" /> <text x="150" y="125" font-size="60" text-anchor="middle" fill="white"> SVG </text> </svg> """;returnVerify(svg,"svg");}Note that the input svg differs from the verified svg, but not in a semantically significant way. Hence this test will pass.
Html can be pretty printed.
[Test]publicTaskPrettyPrintHtml(){varhtml=""" <!DOCTYPE html> <html><body><h1>My First Heading</h1> <p>My first paragraph.</p></body></html> """;returnVerify(html,"html").PrettyPrintHtml();}Results in
<!DOCTYPE html><html><head></head><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>To apply this to all html files use HtmlPrettyPrint.All();
Nodes can be manipulated as part of the pretty print:
[Test]publicTaskPrettyPrintHtmlWithNodeManipulation(){varhtml=""" <!DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html> """;returnVerify(html,"html").PrettyPrintHtml(
nodes =>{foreach(varnodeinnodes.QuerySelectorAll("h1")){node.Remove();}});}Results in
<!DOCTYPE html><html><head></head><body><p>My first paragraph.</p></body></html>[Test]publicTaskScrubEmptyDivs(){varhtml=""" <!DOCTYPE html> <html> <body> <div>My First Heading</div> <div></div> </body> </html> """;returnVerify(html,"html").PrettyPrintHtml(nodes =>nodes.ScrubEmptyDivs());}Results in:
<!DOCTYPE html><html><head></head><body><div>My First Heading</div></body></html>[Test]publicTaskScrubAttributes(){varhtml=""" <!DOCTYPE html> <html> <body> <div id='a'>My First Heading</div> </body> </html> """;returnVerify(html,"html").PrettyPrintHtml(nodes =>nodes.ScrubAttributes("id"));}Results in:
<!DOCTYPE html><html><head></head><body><div>My First Heading</div></body></html>[Test]publicTaskScrubAttributeWithNewValue(){varhtml=""" <!DOCTYPE html> <html> <body> <div id='a'>My First Heading</div> </body> </html> """;returnVerify(html,"html").PrettyPrintHtml(
nodes =>nodes.ScrubAttributes(x =>{if(x.Name=="id"){return"new value";}returnnull;}));}Results in:
<!DOCTYPE html><html><head></head><body><divid="new value">My First Heading</div></body></html>[Test]publicTaskScrubAspCacheBusterTagHelper(){varhtml=""" <!DOCTYPE html> <html> <head> <link href="/css/site.css?v=r2K1aJs2_7mdAedOAb0OQw3K46ElgPZWqeuI" rel="stylesheet" /> </head> <body> <h1>My Heading</h1> </body> </html> """;returnVerify(html,"html").PrettyPrintHtml(nodes =>nodes.ScrubAspCacheBusterTagHelper());}Results in:
<!DOCTYPE html><html><head><linkhref="/css/site.css?v={TAG_HELPER_VERSION}" rel="stylesheet"></head><body><h1>My Heading</h1></body></html>[Test]publicTaskScrubBrowserLink(){varhtml=""" <!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <h1>My Heading</h1> <!-- Visual Studio Browser Link --> <script src="/_vs/browserLink"> </script> <script src="/_framework/aspnetcore-browser-refresh.js"> </script> <!-- End Browser Link --> </body> </html> """;returnVerify(html,"html").PrettyPrintHtml(nodes =>nodes.ScrubBrowserLink());}Results in:
<!DOCTYPE html><html><head><metacharset="utf-8"></head><body><h1>My Heading</h1></body></html>