[Twig] More test cases and fixes for edge case HTML syntax

Author: weaverryan

src/TwigComponent/src/Twig/TwigPreLexer.php

@@ -180,6 +180,11 @@ private function consumeAttributes(string $componentName): string
 
             // <twig:component someProp> -> someProp: true
             if (!$this->check('=')) {
+                // don't allow "<twig:component :someProp>"
+                if ($isAttributeDynamic) {
+                    throw new SyntaxError(sprintf('Expected "=" after ":%s" when parsing the "<twig:%s" syntax.', $key, $componentName), $this->line);
+                }
+
                 $attributes[] = sprintf('%s: true', $key);
                 $this->consumeWhitespace();
                 continue;
@@ -188,24 +193,15 @@ private function consumeAttributes(string $componentName): string
             $this->expectAndConsumeChar('=');
             $quote = $this->consumeChar(["'", '"']);
 
-            // someProp="{{ dynamicVar }}"
-            if ($this->consume('{{')) {
-                $this->consumeWhitespace();
-                $attributeValue = rtrim($this->consumeUntil('}'));
-                $this->expectAndConsumeChar('}');
-                $this->expectAndConsumeChar('}');
-                $this->consumeUntil($quote);
-
-                $attributes[] = sprintf('%s: %s', $key, $attributeValue);
+            if ($isAttributeDynamic) {
+                // :someProp="dynamicVar"
+                $attributeValue = $this->consumeUntil($quote);
             } else {
                 $attributeValue = $this->consumeAttributeValue($quote);
-
-                if ($isAttributeDynamic) {
-                    $attributes[] = sprintf('%s: %s', $key, $attributeValue);
-                } else {
-                    $attributes[] = sprintf("%s: '%s'", $key, $attributeValue);
-                }
             }
+
+            $attributes[] = sprintf('%s: %s', $key, $attributeValue);
+
             $this->expectAndConsumeChar($quote);
             $this->consumeWhitespace();
         }
@@ -246,6 +242,12 @@ private function consumeChar($validChars = null): string
         return $char;
     }
 
+    /**
+     * Moves the position forward until it finds $endString.
+     *
+     * Any string consumed *before* finding that string is returned.
+     * The position is moved forward to just *before* $endString.
+     */
     private function consumeUntil(string $endString): string
     {
         $start = $this->position;
@@ -284,9 +286,14 @@ private function expectAndConsumeChar(string $char): void
             throw new \InvalidArgumentException('Expected a single character');
         }
 
-        if ($this->position >= $this->length || $this->input[$this->position] !== $char) {
+        if ($this->position >= $this->length) {
+            throw new SyntaxError("Expected '{$char}' but reached the end of the file.", $this->line);
+        }
+
+        if ($this->input[$this->position] !== $char) {
             throw new SyntaxError("Expected '{$char}' but found '{$this->input[$this->position]}'.", $this->line);
         }
+
         ++$this->position;
     }
 
@@ -370,39 +377,43 @@ private function consumeUntilEndBlock(): string
 
     private function consumeAttributeValue(string $quote): string
     {
-        $attributeValue = '';
+        $parts = [];
+        $currentPart = '';
         while ($this->position < $this->length) {
-            if (substr($this->input, $this->position, 1) === $quote) {
+            if ($this->check($quote)) {
                 break;
             }
 
             if ("\n" === $this->input[$this->position]) {
                 ++$this->line;
             }
 
-            if ('\'' === $this->input[$this->position]) {
-                $attributeValue .= "\'";
-                ++$this->position;
-
-                continue;
-            }
+            if ($this->check('{{')) {
+                // mark any previous static text as complete: push into parts
+                if ('' !== $currentPart) {
+                    $parts[] = sprintf("'%s'", str_replace("'", "\'", $currentPart));
+                    $currentPart = '';
+                }
 
-            if ('{{' === substr($this->input, $this->position, 2)) {
+                // consume the entire {{ }} block
                 $this->consume('{{');
-                $attributeValue .= "'~(";
                 $this->consumeWhitespace();
-                $value = rtrim($this->consumeUntil('}}'));
+                $parts[] = sprintf('(%s)', rtrim($this->consumeUntil('}}')));
                 $this->expectAndConsumeChar('}');
                 $this->expectAndConsumeChar('}');
-                $attributeValue .= $value;
-                $attributeValue .= ")~'";
+
+                continue;
             }
 
-            $attributeValue .= $this->input[$this->position];
+            $currentPart .= $this->input[$this->position];
             ++$this->position;
         }
 
-        return $attributeValue;
+        if ('' !== $currentPart) {
+            $parts[] = sprintf("'%s'", str_replace("'", "\'", $currentPart));
+        }
+
+        return implode('~', $parts);
     }
 
     private function doesStringEventuallyExist(string $needle): bool

src/TwigComponent/tests/Unit/TwigPreLexerTest.php

@@ -39,7 +39,7 @@ public function getLexTests(): iterable
 
         yield 'component_with_dynamic_attributes' => [
             '<twig:foo dynamic="{{ dynamicVar }}" :otherDynamic="anotherVar" />',
-            '{{ component(\'foo\', { dynamic: dynamicVar, otherDynamic: anotherVar }) }}',
+            '{{ component(\'foo\', { dynamic: (dynamicVar), otherDynamic: anotherVar }) }}',
         ];
 
         yield 'component_with_closing_tag' => [
@@ -100,6 +100,14 @@ public function getLexTests(): iterable
             '<twig:foo text="Hello {{ name }}!"/>',
             "{{ component('foo', { text: 'Hello '~(name)~'!' }) }}",
         ];
+        yield 'component_with_mixture_of_dynamic_twig_from_start' => [
+            '<twig:foo text="{{ name   }} is my name{{ ending~\'!!\' }}"/>',
+            "{{ component('foo', { text: (name)~' is my name'~(ending~'!!') }) }}",
+        ];
+        yield 'dynamic_attribute_with_quotation_included' => [
+            '<twig:foo text="{{ "hello!" }}"/>',
+            "{{ component('foo', { text: (\"hello!\") }) }}",
+        ];
         yield 'component_with_mixture_of_string_and_twig_with_quote_in_argument' => [
             '<twig:foo text="Hello {{ name }}, I\'m Theo!"/>',
             "{{ component('foo', { text: 'Hello '~(name)~', I\'m Theo!' }) }}",
@@ -128,5 +136,20 @@ public function getLexTests(): iterable
             {% endblock %}{% endcomponent %}
             EOF
         ];
+
+        yield 'string_inside_of_twig_code_not_escaped' => [
+            <<<EOF
+            <twig:TabbedCodeBlocks :files="[
+                'src/Twig/MealPlanner.php',
+                'templates/components/MealPlanner.html.twig',
+            ]" />
+            EOF,
+            <<<EOF
+            {{ component('TabbedCodeBlocks', { files: [
+                'src/Twig/MealPlanner.php',
+                'templates/components/MealPlanner.html.twig',
+            ] }) }}
+            EOF
+        ];
     }
 }