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.

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

Update css parser #22

Merged
merged 2 commits into from
May 29, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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 src/Compiler/Enum.cs
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,6 @@ internal static class Enum
public const string FONT_FACE = "@font-face";
public const string COUNTER_STYLE = "@counter-style";
public const string FONT_FEATURE_VALUES = "@font-feature-values";

public const string LAYER = "@layer";
}
}
6 changes: 3 additions & 3 deletions src/Compiler/Parser.cs
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ public static List<Element> Parse(Tokenizer tokenizer, string value, Element roo
case 40:
if (previous != 108 && CharAt(characters, length - 1) == 58)
{
if (IndexOf(characters += Replace(tokenizer.Delimit(character), "&", "&\f"), "&\f") != -1)
if (IndexOf(characters += Replace(tokenizer.Delimit(character), "&", "&\f"), "&\f", Abs(index != 0 ? points[index - 1] : 0)) != -1)
ampersand = -1;
break;
}
Expand Down Expand Up @@ -95,8 +95,8 @@ public static List<Element> Parse(Tokenizer tokenizer, string value, Element roo
else
switch (atrule == 99 && CharAt(characters, 3) == 110 ? 100 : atrule)
{
// d m s
case 100 or 109 or 115:
// d l m s
case 100 or 108 or 109 or 115:
var p = new List<Element>();
if (rule != null)
{
Expand Down
1 change: 1 addition & 0 deletions src/Compiler/Serializer.cs
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ public static string Stringify(Element element, SerializeCallback callback)
{
switch (element.Type)
{
case LAYER: if(element.Children.Count != 0) break; goto case IMPORT;
case IMPORT: case DECLARATION: return element.Return = !string.IsNullOrEmpty(element.Return) ? element.Return : element.Value;
case COMMENT: return "";
case KEYFRAMES: return element.Return = element.Value + "{" + Serialize(element.Children, callback) + "}";
Expand Down
4 changes: 2 additions & 2 deletions src/Compiler/Utility.cs
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,9 @@ public static int CharAt(string value, int index)
return (int) value[index];
}

public static int IndexOf(string value, string search)
public static int IndexOf(string value, string search, int position)
{
return value.IndexOf(search);
return value.IndexOf(search, position);
}

public static string Replace(string value, string pattern, string replacement, bool all = false)
Expand Down
84 changes: 84 additions & 0 deletions test/CssInCSharp.Tests/ParserTests.cs
Original file line number Diff line number Diff line change
Expand Up @@ -142,6 +142,21 @@ public void Ampersand_In_String()
).ShouldBe(".user [href=\"https://css-tricks.com?a=1&b=2\"]{color:red;}");
}

[Fact]
public void Ampersand_In_First_Selector_Within_A_CommaSeparated_List()
{
stylis(@"
div {
display: flex;

&.foo,
p:not(:last-child) {
background: red;
}
}
").ShouldBe(".user div{display:flex;}.user div.foo,.user div p:not(:last-child){background:red;}");
}

[Fact]
public void Escaped_Chars_In_Selector_Identifiers()
{
Expand Down Expand Up @@ -769,6 +784,10 @@ public void Context_Character()
.ShouldBe(string.Join("",
".user{background:url[img}.png];}",
".user .a{background:url[img}.png];}"));
stylis("background: url(i&m&g.png);.a {background: url(i&m&g.png);}")
.ShouldBe(string.Join("",
".user{background:url(i&m&g.png);}",
".user .a{background:url(i&m&g.png);}"));
}

[Fact]
Expand Down Expand Up @@ -1000,5 +1019,70 @@ public void Nested()
".user.foo.bar{color:orange;}",
".user.foo.bar.barbar{color:orange;}"));
}

[Fact]
public void Cascade_Layer()
{
stylis(@"
@layer base {
border-left:1px solid hotpink;
}
").ShouldBe("@layer base{.user{border-left:1px solid hotpink;}}");

stylis(@"
@layer base {
@layer layout {
border-left:1px solid hotpink;
}
}
").ShouldBe("@layer base{@layer layout{.user{border-left:1px solid hotpink;}}}");

stylis(@"
@layer framework.layout {
border-left:1px solid hotpink;
}
").ShouldBe("@layer framework.layout{.user{border-left:1px solid hotpink;}}");

stylis(@"
@import ""theme.css"" layer(utilties);
").ShouldBe("@import \"theme.css\" layer(utilties);");

stylis(@"
@import ""foo"";
").ShouldBe("@import \"foo\";");

stylis(@"
@layer utilities;
").ShouldBe("@layer utilities;");

stylis(@"
@layer theme, layout, utilities;
").ShouldBe("@layer theme,layout,utilities;");

stylis(@"
@media (min-width: 30em) {
@layer layout {
.title { font-size: x-large; }
}
}

@layer theme {
@media (prefers-color-scheme: dark) {
.title { color: white; }
}
}
").ShouldBe(string.Join("",
"@media (min-width: 30em){@layer layout{.user .title{font-size:x-large;}}}",
"@layer theme{@media (prefers-color-scheme: dark){.user .title{color:white;}}}"));

stylis(@"
@layer framework {
@keyframes slide-left {
from { margin-left: 0; }
to { margin-left: -100%; }
}
}
").ShouldBe("@layer framework{@keyframes slide-left{from{margin-left:0;}to{margin-left:-100%;}}}");
}
}
}
Loading