diff --git a/packages/react-native/ReactCommon/react/renderer/css/CSSToken.h b/packages/react-native/ReactCommon/react/renderer/css/CSSToken.h index 090af4db296736..e7e363365dd47e 100644 --- a/packages/react-native/ReactCommon/react/renderer/css/CSSToken.h +++ b/packages/react-native/ReactCommon/react/renderer/css/CSSToken.h @@ -31,6 +31,7 @@ enum class CSSTokenType { OpenSquare, Percentage, WhiteSpace, + Hash, }; /* diff --git a/packages/react-native/ReactCommon/react/renderer/css/CSSTokenizer.h b/packages/react-native/ReactCommon/react/renderer/css/CSSTokenizer.h index b5466c5e7790f5..c5e28c75e6ed92 100644 --- a/packages/react-native/ReactCommon/react/renderer/css/CSSTokenizer.h +++ b/packages/react-native/ReactCommon/react/renderer/css/CSSTokenizer.h @@ -61,6 +61,12 @@ class CSSTokenizer { } else { return consumeDelim(); } + case '#': + if (isIdent(peek(1))) { + return consumeHash(); + } else { + return consumeDelim(); + } } if (isDigit(nextChar)) { @@ -225,6 +231,14 @@ class CSSTokenizer { return {CSSTokenType::Ident, consumeRunningValue()}; } + constexpr CSSToken consumeHash() { + // https://www.w3.org/TR/css-syntax-3/#consume-token (U+0023 NUMBER SIGN) + advance(); + consumeRunningValue(); + + return {CSSTokenType::Hash, consumeIdentSequence().stringValue()}; + } + constexpr std::string_view consumeRunningValue() { auto next = remainingCharacters_.substr(0, position_); remainingCharacters_ = remainingCharacters_.substr(next.size()); diff --git a/packages/react-native/ReactCommon/react/renderer/css/tests/CSSTokenizerTest.cpp b/packages/react-native/ReactCommon/react/renderer/css/tests/CSSTokenizerTest.cpp index 7083a37da42c04..3d44b58f9f4eb3 100644 --- a/packages/react-native/ReactCommon/react/renderer/css/tests/CSSTokenizerTest.cpp +++ b/packages/react-native/ReactCommon/react/renderer/css/tests/CSSTokenizerTest.cpp @@ -202,4 +202,21 @@ TEST(CSSTokenizer, invalid_values) { CSSToken{CSSTokenType::EndOfFile}); } +TEST(CSSTokenizer, hash_values) { + EXPECT_TOKENS( + "#Ff03BC", + CSSToken{CSSTokenType::Hash, "Ff03BC"}, + CSSToken{CSSTokenType::EndOfFile}); + + EXPECT_TOKENS( + "#identifier", + CSSToken{CSSTokenType::Hash, "identifier"}, + CSSToken{CSSTokenType::EndOfFile}); + + EXPECT_TOKENS( + "#*", + CSSToken{CSSTokenType::Delim, "#"}, + CSSToken{CSSTokenType::Delim, "*"}, + CSSToken{CSSTokenType::EndOfFile}); +} } // namespace facebook::react