Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Avoid adding CSS scope to elements in HEAD #32709

Merged
merged 3 commits into from
May 17, 2021
Merged

Avoid adding CSS scope to elements in HEAD #32709

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fbe950b
Avoid adding CSS scope to elements in HEAD
captainsafia May 14, 2021
46975d6
Set StringComparison type for comparison
captainsafia May 15, 2021
dcbb552
Update contains check
captainsafia May 17, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ...s/IntegrationTests/CodeGenerationIntegrationTest/RazorView_Layout_WithCssScope.codegen.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ public class TestFiles_IntegrationTests_CodeGenerationIntegrationTest_test : glo
#pragma warning disable 1998
public async override global::System.Threading.Tasks.Task ExecuteAsync()
{
WriteLiteral("\r\n<!DOCTYPE html>\r\n<html TestCssScope lang=\"en\">\r\n<head TestCssScope>\r\n <meta TestCssScope charset=\"utf-8\" />\r\n <meta TestCssScope name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\r\n <title TestCssScope>");
WriteLiteral("\r\n<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"utf-8\" />\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\r\n <title>");
#nullable restore
#line 7 "TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml"
Write(ViewData["Title"]);
Expand Down
5 changes: 0 additions & 5 deletions ...Files/IntegrationTests/CodeGenerationIntegrationTest/RazorView_Layout_WithCssScope.ir.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,29 +15,24 @@ Document -
LazyIntermediateToken - (0:0,0 [2] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - \n
LazyIntermediateToken - (2:1,0 [17] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - <!DOCTYPE html>\n
LazyIntermediateToken - (19:2,0 [5] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - <html
IntermediateToken - - Html - TestCssScope
LazyIntermediateToken - (24:2,5 [10] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - lang="en"
LazyIntermediateToken - (34:2,15 [1] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - >
LazyIntermediateToken - (35:2,16 [2] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - \n
LazyIntermediateToken - (37:3,0 [5] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - <head
IntermediateToken - - Html - TestCssScope
LazyIntermediateToken - (42:3,5 [1] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - >
LazyIntermediateToken - (43:3,6 [6] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - \n
LazyIntermediateToken - (49:4,4 [5] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - <meta
IntermediateToken - - Html - TestCssScope
LazyIntermediateToken - (54:4,9 [16] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - charset="utf-8"
LazyIntermediateToken - (70:4,25 [1] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html -
LazyIntermediateToken - (71:4,26 [2] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - />
LazyIntermediateToken - (73:4,28 [6] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - \n
LazyIntermediateToken - (79:5,4 [5] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - <meta
IntermediateToken - - Html - TestCssScope
LazyIntermediateToken - (84:5,9 [16] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - name="viewport"
LazyIntermediateToken - (100:5,25 [48] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - content="width=device-width, initial-scale=1.0"
LazyIntermediateToken - (148:5,73 [1] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html -
LazyIntermediateToken - (149:5,74 [2] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - />
LazyIntermediateToken - (151:5,76 [6] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - \n
LazyIntermediateToken - (157:6,4 [6] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - <title
IntermediateToken - - Html - TestCssScope
LazyIntermediateToken - (163:6,10 [1] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - Html - >
CSharpExpression - (165:6,12 [17] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml)
LazyIntermediateToken - (165:6,12 [17] TestFiles\IntegrationTests\CodeGenerationIntegrationTest\test.cshtml) - CSharp - ViewData["Title"]
Expand Down
29 changes: 26 additions & 3 deletions src/Razor/Microsoft.AspNetCore.Razor.Language/src/Extensions/ViewCssScopePass.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,9 +41,7 @@ private void ProcessElement(HtmlContentIntermediateNode node, string cssScope)
var child = node.Children[i];
if (child is IntermediateToken token && token.IsHtml)
{
var content = token.Content;
var isValidToken = content.StartsWith("<", StringComparison.Ordinal) && !content.StartsWith("</", StringComparison.Ordinal) && !content.StartsWith("<!", StringComparison.Ordinal);
if (isValidToken)
if (IsValidElement(token))
{
node.Children.Insert(i + 1, new IntermediateToken()
{
Expand All @@ -55,6 +53,31 @@ private void ProcessElement(HtmlContentIntermediateNode node, string cssScope)
}
}
}

bool IsValidElement(IntermediateToken token)
{
var content = token.Content;
var isValidToken = content.StartsWith("<", StringComparison.Ordinal)
&& !content.StartsWith("</", StringComparison.Ordinal)
&& !content.StartsWith("<!", StringComparison.Ordinal);
/// <remarks>
/// We want to avoid adding the CSS scope to elements that do not appear
/// within the body element of the document. When this pass executes over the
/// nodes, we don't have the ability to store whether we are a descandant of a
/// `head` or `body` element so it is not possible to discern whether the tag
/// is valid this way. Instead, we go for a straight-forward check on the tag
/// name that we are currently inspecting.
/// </remarks>
var isInvalidTag = content.Contains("head")
|| content.Contains("meta")
|| content.Contains("title")
|| content.Contains("link")
|| content.Contains("base")
|| content.Contains("script")
|| content.Contains("style")
|| content.Contains("html");
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I believe these should be StringComparison.OrdinalIgnoreCase

return isValidToken && !isInvalidTag;
}
}
}
}