Skip to content

Commit 0be1e98

Browse files
committed
Add simple vue bindings
1 parent 22ed346 commit 0be1e98

File tree

5 files changed

+62
-15
lines changed

5 files changed

+62
-15
lines changed

src/Compiler.php

Lines changed: 24 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,9 @@
1313

1414
class Compiler
1515
{
16+
protected const DOUBLE_CURLY_OPEN = '__DOUBLE_CURLY_OPEN__';
17+
protected const DOUBLE_CURLY_CLOSE = '__DOUBLE_CURLY_CLOSE__';
18+
1619
/** @var String[] */
1720
protected $components;
1821

@@ -30,6 +33,8 @@ public function __construct(DOMDocument $document, LoggerInterface $logger)
3033
$this->logger = $logger;
3134
$this->document = $document;
3235
$this->lastCloseIf = null;
36+
37+
$this->logger->debug("\n--------- New Compiler Instance ----------\n");
3338
}
3439

3540
/**
@@ -46,7 +51,7 @@ public function convert(): string
4651
$rootNode = $this->getRootNode($templateElement);
4752
$resultNode = $this->convertNode($rootNode);
4853

49-
return $this->document->saveHTML($resultNode);
54+
return $this->replacePlaceholders($this->document->saveHTML($resultNode));
5055
}
5156

5257
public function convertNode(DOMNode $node): DOMNode
@@ -95,7 +100,7 @@ private function handleAttributeBinding(DOMElement $node)
95100
continue;
96101
}
97102

98-
$name = substr($attribute->name, 1);
103+
$name = substr($attribute->name, strpos($attribute->name, ':') + 1);
99104
$value = $attribute->value;
100105
$this->logger->debug('- handle: ' . $name . ' = ' . $value);
101106

@@ -110,17 +115,18 @@ private function handleAttributeBinding(DOMElement $node)
110115
break;
111116
default:
112117
if ($value === 'true') {
118+
$this->logger->debug('- setAttribute '.$name);
113119
$node->setAttribute($name, $name);
120+
} else {
121+
$this->logger->debug('- setAttribute "'.$name.'" with value');
122+
$node->setAttribute(
123+
$name,
124+
self::DOUBLE_CURLY_OPEN.$value.self::DOUBLE_CURLY_CLOSE
125+
);
114126
}
115-
$node->setAttribute($name, $value);
116127
}
117128

118-
if (is_bool($value)) {
119-
if ($value) {
120-
$this->logger->debug('=> setAttribute');
121-
$node->setAttribute($name, $name);
122-
}
123-
} elseif (is_array($value)) {
129+
if (is_array($value)) {
124130
if ($name === 'style') {
125131
$styles = [];
126132
foreach ($value as $prop => $setting) {
@@ -141,7 +147,7 @@ private function handleAttributeBinding(DOMElement $node)
141147
}
142148
}
143149

144-
$this->logger->debug('=> remove ' . $attribute->name);
150+
$this->logger->debug('=> remove original ' . $attribute->name);
145151
$node->removeAttribute($attribute->name);
146152
}
147153
}
@@ -251,11 +257,6 @@ private function stripEventHandlers(DOMElement $node)
251257
}
252258
}
253259

254-
private function isTextNode(DOMNode $node): bool
255-
{
256-
return $node instanceof DOMCharacterData;
257-
}
258-
259260
/**
260261
* @throws Exception
261262
*/
@@ -282,4 +283,12 @@ private function getRootNode(DOMElement $element): \DOMNode
282283

283284
return $firstTagNode;
284285
}
286+
287+
protected function replacePlaceholders(string $string)
288+
{
289+
$string = str_replace(self::DOUBLE_CURLY_OPEN, '{{', $string);
290+
$string = str_replace(self::DOUBLE_CURLY_CLOSE, '}}', $string);
291+
292+
return $string;
293+
}
285294
}

tests/AbstractTestCase.php

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ protected function createCompiler(string $template): Compiler
1515
$document = $this->createDocumentWithHtml($template);
1616
$compiler = new Compiler($document, $this->createLogger());
1717

18+
1819
return $compiler;
1920
}
2021

tests/VueBindingsTest.php

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<?php
2+
3+
namespace Macavity\VueToTwig\Tests;
4+
5+
class VueBindingsTest extends AbstractTestCase
6+
{
7+
/**
8+
* @dataProvider dataProvider
9+
*/
10+
public function testBindings($html, $expected)
11+
{
12+
$compiler = $this->createCompiler($html);
13+
14+
$actual = $compiler->convert();
15+
16+
$this->assertEqualHtml($expected, $actual);
17+
}
18+
19+
public function dataProvider()
20+
{
21+
return $this->loadFixturesFromDir('vue-bind');
22+
}
23+
}

tests/fixtures/vue-bind/bindings.twig

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<div>
2+
<div>
3+
<input type="radio" checked>
4+
<img src="{{imageSrc}}">
5+
</div>
6+
</div>

tests/fixtures/vue-bind/bindings.vue

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<template>
2+
<div>
3+
<div>
4+
<input type="radio" :checked="true">
5+
<img :src="imageSrc">
6+
</div>
7+
</div>
8+
</template>

0 commit comments

Comments
 (0)