Merge pull request #15 from Paneon/feature/SHODEVS2-26

SHODEVS2-26 add attribute handling for data-twig-if
Paneon · Feb 15, 2019 · 4fa9a19 · 4fa9a19
2 parents cb741b2 + 33b6e8f
commit 4fa9a19
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 3 deletions.
diff --git a/src/Compiler.php b/src/Compiler.php
@@ -78,7 +78,7 @@ public function convert(): string
 
  $html = $this->replacePlaceholders($html);
 
- if($this->stripWhitespace) {
+ if ($this->stripWhitespace) {
  $html = $this->stripWhitespace($html);
  }
 
@@ -248,7 +248,12 @@ private function handleIf(DOMElement $node): void
  }
 
  if ($node->hasAttribute('v-if')) {
- $condition = $node->getAttribute('v-if');
+
+ if ($node->hasAttribute('data-twig-if')) {
+ $condition = $node->getAttribute('data-twig-if');
+ } else {
+ $condition = $node->getAttribute('v-if');
+ }
  $condition = $this->sanitizeCondition($condition);
 
  // Open with if
@@ -262,8 +267,14 @@ private function handleIf(DOMElement $node): void
  $this->lastCloseIf = $closeIf;
 
  $node->removeAttribute('v-if');
+ $node->removeAttribute('data-twig-if');
  } elseif ($node->hasAttribute('v-else-if')) {
- $condition = $node->getAttribute('v-else-if');
+
+ if ($node->hasAttribute('data-twig-if')) {
+ $condition = $node->getAttribute('data-twig-if');
+ } else {
+ $condition = $node->getAttribute('v-else-if');
+ }
  $condition = $this->sanitizeCondition($condition);
 
  // Replace old endif with else
@@ -275,6 +286,7 @@ private function handleIf(DOMElement $node): void
  $this->lastCloseIf = $closeIf;
 
  $node->removeAttribute('v-else-if');
+ $node->removeAttribute('data-twig-if');
  } elseif ($node->hasAttribute('v-else')) {
  // Replace old endif with else
  $this->lastCloseIf->textContent = $this->builder->createElse();

diff --git a/tests/fixtures/vue-if/if-data-twig.twig b/tests/fixtures/vue-if/if-data-twig.twig
@@ -0,0 +1,11 @@
+<div>
+ {% if array|length %}
+ <div>
+ <h1>Headline</h1>
+ </div>
+ {% elseif array|length < 100 %}
+ <div>
+ <h1>Headline</h1>
+ </div>
+ {% endif %}
+</div>
diff --git a/tests/fixtures/vue-if/if-data-twig.vue b/tests/fixtures/vue-if/if-data-twig.vue
@@ -0,0 +1,10 @@
+<template>
+ <div>
+ <div v-if="array.length" data-twig-if="array|length">
+ <h1>Headline</h1>
+ </div>
+ <div v-else-if="array.length < 100" data-twig-if="array|length < 100">
+ <h1>Headline</h1>
+ </div>
+ </div>
+</template>