Skip to content

Commit ad9d7ea

Browse files
committed
Interactivity API: Prevent warning when using a bind directive with a short attribute name.
Adds new tests and improves existing ones by using `assertSame` to do type comparison as well. Props jonsurrell, cbravobernal, swissspidy, gziolo. Fixes #60758. git-svn-id: https://develop.svn.wordpress.org/trunk@57835 602fd350-edb4-49c9-b593-d223f7449a82
1 parent a590468 commit ad9d7ea

2 files changed

Lines changed: 62 additions & 38 deletions

File tree

src/wp-includes/interactivity-api/class-wp-interactivity-api.php

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -591,15 +591,24 @@ private function data_wp_bind_processor( WP_Interactivity_API_Directives_Process
591591
$attribute_value = $p->get_attribute( $attribute_name );
592592
$result = $this->evaluate( $attribute_value, end( $namespace_stack ), end( $context_stack ) );
593593

594-
if ( null !== $result && ( false !== $result || '-' === $bound_attribute[4] ) ) {
594+
if (
595+
null !== $result &&
596+
(
597+
false !== $result ||
598+
( strlen( $bound_attribute ) > 5 && '-' === $bound_attribute[4] )
599+
)
600+
) {
595601
/*
596602
* If the result of the evaluation is a boolean and the attribute is
597603
* `aria-` or `data-, convert it to a string "true" or "false". It
598604
* follows the exact same logic as Preact because it needs to
599605
* replicate what Preact will later do in the client:
600606
* https://github.com/preactjs/preact/blob/ea49f7a0f9d1ff2c98c0bdd66aa0cbc583055246/src/diff/props.js#L131C24-L136
601607
*/
602-
if ( is_bool( $result ) && '-' === $bound_attribute[4] ) {
608+
if (
609+
is_bool( $result ) &&
610+
( strlen( $bound_attribute ) > 5 && '-' === $bound_attribute[4] )
611+
) {
603612
$result = $result ? 'true' : 'false';
604613
}
605614
$p->set_attribute( $bound_attribute, $result );

tests/phpunit/tests/interactivity-api/wpInteractivityAPI-wp-bind.php

Lines changed: 51 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ public function set_up() {
3333
'null' => null,
3434
'trueString' => 'true',
3535
'falseString' => 'false',
36+
'trueValue' => true,
37+
'falseValue' => false,
3638
)
3739
);
3840
}
@@ -60,7 +62,7 @@ private function process_directives( $html ) {
6062
public function test_wp_bind_sets_attribute() {
6163
$html = '<div data-wp-bind--id="myPlugin::state.id">Text</div>';
6264
list($p) = $this->process_directives( $html );
63-
$this->assertEquals( 'some-id', $p->get_attribute( 'id' ) );
65+
$this->assertSame( 'some-id', $p->get_attribute( 'id' ) );
6466
}
6567

6668
/**
@@ -73,7 +75,7 @@ public function test_wp_bind_sets_attribute() {
7375
public function test_wp_bind_replaces_attribute() {
7476
$html = '<div id="other-id" data-wp-bind--id="myPlugin::state.id">Text</div>';
7577
list($p) = $this->process_directives( $html );
76-
$this->assertEquals( 'some-id', $p->get_attribute( 'id' ) );
78+
$this->assertSame( 'some-id', $p->get_attribute( 'id' ) );
7779
}
7880

7981
/**
@@ -86,7 +88,7 @@ public function test_wp_bind_replaces_attribute() {
8688
public function test_wp_bind_sets_number_value() {
8789
$html = '<img data-wp-bind--width="myPlugin::state.width">';
8890
list($p) = $this->process_directives( $html );
89-
$this->assertEquals( '100', $p->get_attribute( 'width' ) );
91+
$this->assertSame( '100', $p->get_attribute( 'width' ) );
9092
}
9193

9294
/**
@@ -99,8 +101,8 @@ public function test_wp_bind_sets_number_value() {
99101
public function test_wp_bind_sets_true_string() {
100102
$html = '<div data-wp-bind--id="myPlugin::state.trueString">Text</div>';
101103
list($p, $new_html) = $this->process_directives( $html );
102-
$this->assertEquals( 'true', $p->get_attribute( 'id' ) );
103-
$this->assertEquals( '<div id="true" data-wp-bind--id="myPlugin::state.trueString">Text</div>', $new_html );
104+
$this->assertSame( 'true', $p->get_attribute( 'id' ) );
105+
$this->assertSame( '<div id="true" data-wp-bind--id="myPlugin::state.trueString">Text</div>', $new_html );
104106
}
105107

106108
/**
@@ -113,8 +115,8 @@ public function test_wp_bind_sets_true_string() {
113115
public function test_wp_bind_sets_false_string() {
114116
$html = '<div data-wp-bind--id="myPlugin::state.falseString">Text</div>';
115117
list($p, $new_html) = $this->process_directives( $html );
116-
$this->assertEquals( 'false', $p->get_attribute( 'id' ) );
117-
$this->assertEquals( '<div id="false" data-wp-bind--id="myPlugin::state.falseString">Text</div>', $new_html );
118+
$this->assertSame( 'false', $p->get_attribute( 'id' ) );
119+
$this->assertSame( '<div id="false" data-wp-bind--id="myPlugin::state.falseString">Text</div>', $new_html );
118120
}
119121

120122
/**
@@ -127,7 +129,7 @@ public function test_wp_bind_sets_false_string() {
127129
public function test_wp_bind_ignores_empty_bound_attribute() {
128130
$html = '<div data-wp-bind="myPlugin::state.id">Text</div>';
129131
$new_html = $this->interactivity->process_directives( $html );
130-
$this->assertEquals( $html, $new_html );
132+
$this->assertSame( $html, $new_html );
131133
}
132134

133135
/**
@@ -141,7 +143,7 @@ public function test_wp_bind_ignores_empty_bound_attribute() {
141143
public function test_wp_bind_doesnt_do_anything_on_non_existent_references() {
142144
$html = '<div data-wp-bind--id="myPlugin::state.nonExistengKey">Text</div>';
143145
$new_html = $this->interactivity->process_directives( $html );
144-
$this->assertEquals( $html, $new_html );
146+
$this->assertSame( $html, $new_html );
145147
}
146148

147149
/**
@@ -154,7 +156,7 @@ public function test_wp_bind_doesnt_do_anything_on_non_existent_references() {
154156
public function test_wp_bind_ignores_empty_value() {
155157
$html = '<div data-wp-bind--id="">Text</div>';
156158
$new_html = $this->interactivity->process_directives( $html );
157-
$this->assertEquals( $html, $new_html );
159+
$this->assertSame( $html, $new_html );
158160
}
159161

160162
/**
@@ -167,7 +169,7 @@ public function test_wp_bind_ignores_empty_value() {
167169
public function test_wp_bind_ignores_without_value() {
168170
$html = '<div data-wp-bind--id>Text</div>';
169171
$new_html = $this->interactivity->process_directives( $html );
170-
$this->assertEquals( $html, $new_html );
172+
$this->assertSame( $html, $new_html );
171173
}
172174

173175
/**
@@ -181,7 +183,7 @@ public function test_wp_bind_ignores_without_value() {
181183
public function test_wp_bind_works_with_multiple_same_directives() {
182184
$html = '<div data-wp-bind--id="myPlugin::state.id" data-wp-bind--id="myPlugin::state.id">Text</div>';
183185
list($p) = $this->process_directives( $html );
184-
$this->assertEquals( 'some-id', $p->get_attribute( 'id' ) );
186+
$this->assertSame( 'some-id', $p->get_attribute( 'id' ) );
185187
}
186188

187189
/**
@@ -195,8 +197,8 @@ public function test_wp_bind_works_with_multiple_same_directives() {
195197
public function test_wp_bind_works_with_multiple_different_directives() {
196198
$html = '<img data-wp-bind--id="myPlugin::state.id" data-wp-bind--width="myPlugin::state.width">';
197199
list($p) = $this->process_directives( $html );
198-
$this->assertEquals( 'some-id', $p->get_attribute( 'id' ) );
199-
$this->assertEquals( '100', $p->get_attribute( 'width' ) );
200+
$this->assertSame( 'some-id', $p->get_attribute( 'id' ) );
201+
$this->assertSame( '100', $p->get_attribute( 'width' ) );
200202
}
201203

202204
/**
@@ -210,7 +212,7 @@ public function test_wp_bind_adds_boolean_attribute_if_true() {
210212
$html = '<div data-wp-bind--hidden="myPlugin::!state.isOpen">Text</div>';
211213
list($p, $new_html) = $this->process_directives( $html );
212214
$this->assertTrue( $p->get_attribute( 'hidden' ) );
213-
$this->assertEquals( '<div hidden data-wp-bind--hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
215+
$this->assertSame( '<div hidden data-wp-bind--hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
214216
}
215217

216218
/**
@@ -225,7 +227,7 @@ public function test_wp_bind_replaces_existing_attribute_if_true() {
225227
$html = '<div hidden="true" data-wp-bind--hidden="myPlugin::!state.isOpen">Text</div>';
226228
list($p, $new_html) = $this->process_directives( $html );
227229
$this->assertTrue( $p->get_attribute( 'hidden' ) );
228-
$this->assertEquals( '<div hidden data-wp-bind--hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
230+
$this->assertSame( '<div hidden data-wp-bind--hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
229231
}
230232

231233
/**
@@ -240,12 +242,12 @@ public function test_wp_bind_doesnt_add_boolean_attribute_if_false_or_null() {
240242
$html = '<div data-wp-bind--hidden="myPlugin::state.isOpen">Text</div>';
241243
list($p, $new_html) = $this->process_directives( $html );
242244
$this->assertNull( $p->get_attribute( 'hidden' ) );
243-
$this->assertEquals( $html, $new_html );
245+
$this->assertSame( $html, $new_html );
244246

245247
$html = '<div data-wp-bind--hidden="myPlugin::state.null">Text</div>';
246248
list($p, $new_html) = $this->process_directives( $html );
247249
$this->assertNull( $p->get_attribute( 'hidden' ) );
248-
$this->assertEquals( $html, $new_html );
250+
$this->assertSame( $html, $new_html );
249251
}
250252

251253
/**
@@ -277,13 +279,13 @@ public function test_wp_bind_removes_boolean_attribute_if_false_or_null() {
277279
public function test_wp_bind_adds_value_if_true_in_aria_or_data_attributes() {
278280
$html = '<div data-wp-bind--aria-hidden="myPlugin::!state.isOpen">Text</div>';
279281
list($p, $new_html) = $this->process_directives( $html );
280-
$this->assertEquals( 'true', $p->get_attribute( 'aria-hidden' ) );
281-
$this->assertEquals( '<div aria-hidden="true" data-wp-bind--aria-hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
282+
$this->assertSame( 'true', $p->get_attribute( 'aria-hidden' ) );
283+
$this->assertSame( '<div aria-hidden="true" data-wp-bind--aria-hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
282284

283285
$html = '<div data-wp-bind--data-is-closed="myPlugin::!state.isOpen">Text</div>';
284286
list($p, $new_html) = $this->process_directives( $html );
285-
$this->assertEquals( 'true', $p->get_attribute( 'data-is-closed' ) );
286-
$this->assertEquals( '<div data-is-closed="true" data-wp-bind--data-is-closed="myPlugin::!state.isOpen">Text</div>', $new_html );
287+
$this->assertSame( 'true', $p->get_attribute( 'data-is-closed' ) );
288+
$this->assertSame( '<div data-is-closed="true" data-wp-bind--data-is-closed="myPlugin::!state.isOpen">Text</div>', $new_html );
287289
}
288290

289291
/**
@@ -297,15 +299,15 @@ public function test_wp_bind_adds_value_if_true_in_aria_or_data_attributes() {
297299
public function test_wp_bind_replaces_value_if_true_in_aria_or_data_attributes() {
298300
$html = '<div aria-hidden="false" data-wp-bind--aria-hidden="myPlugin::!state.isOpen">Text</div>';
299301
list($p, $new_html) = $this->process_directives( $html );
300-
$this->assertEquals( 'true', $p->get_attribute( 'aria-hidden' ) );
301-
$this->assertEquals( '<div aria-hidden="true" data-wp-bind--aria-hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
302+
$this->assertSame( 'true', $p->get_attribute( 'aria-hidden' ) );
303+
$this->assertSame( '<div aria-hidden="true" data-wp-bind--aria-hidden="myPlugin::!state.isOpen">Text</div>', $new_html );
302304

303305
$html = '<div data-is-closed="false" data-wp-bind--data-is-closed="myPlugin::!state.isOpen">Text</div>';
304306
$new_html = $this->interactivity->process_directives( $html );
305307
$p = new WP_HTML_Tag_Processor( $new_html );
306308
$p->next_tag();
307-
$this->assertEquals( 'true', $p->get_attribute( 'data-is-closed' ) );
308-
$this->assertEquals( '<div data-is-closed="true" data-wp-bind--data-is-closed="myPlugin::!state.isOpen">Text</div>', $new_html );
309+
$this->assertSame( 'true', $p->get_attribute( 'data-is-closed' ) );
310+
$this->assertSame( '<div data-is-closed="true" data-wp-bind--data-is-closed="myPlugin::!state.isOpen">Text</div>', $new_html );
309311
}
310312

311313
/**
@@ -319,13 +321,13 @@ public function test_wp_bind_replaces_value_if_true_in_aria_or_data_attributes()
319321
public function test_wp_bind_adds_value_if_false_in_aria_or_data_attributes() {
320322
$html = '<div data-wp-bind--aria-hidden="myPlugin::state.isOpen">Text</div>';
321323
list($p, $new_html) = $this->process_directives( $html );
322-
$this->assertEquals( 'false', $p->get_attribute( 'aria-hidden' ) );
323-
$this->assertEquals( '<div aria-hidden="false" data-wp-bind--aria-hidden="myPlugin::state.isOpen">Text</div>', $new_html );
324+
$this->assertSame( 'false', $p->get_attribute( 'aria-hidden' ) );
325+
$this->assertSame( '<div aria-hidden="false" data-wp-bind--aria-hidden="myPlugin::state.isOpen">Text</div>', $new_html );
324326

325327
$html = '<div data-wp-bind--data-is-closed="myPlugin::state.isOpen">Text</div>';
326328
list($p, $new_html) = $this->process_directives( $html );
327-
$this->assertEquals( 'false', $p->get_attribute( 'data-is-closed' ) );
328-
$this->assertEquals( '<div data-is-closed="false" data-wp-bind--data-is-closed="myPlugin::state.isOpen">Text</div>', $new_html );
329+
$this->assertSame( 'false', $p->get_attribute( 'data-is-closed' ) );
330+
$this->assertSame( '<div data-is-closed="false" data-wp-bind--data-is-closed="myPlugin::state.isOpen">Text</div>', $new_html );
329331
}
330332

331333
/**
@@ -339,13 +341,13 @@ public function test_wp_bind_adds_value_if_false_in_aria_or_data_attributes() {
339341
public function test_wp_bind_replaces_value_if_false_in_aria_or_data_attributes() {
340342
$html = '<div aria-hidden="true" data-wp-bind--aria-hidden="myPlugin::state.isOpen">Text</div>';
341343
list($p, $new_html) = $this->process_directives( $html );
342-
$this->assertEquals( 'false', $p->get_attribute( 'aria-hidden' ) );
343-
$this->assertEquals( '<div aria-hidden="false" data-wp-bind--aria-hidden="myPlugin::state.isOpen">Text</div>', $new_html );
344+
$this->assertSame( 'false', $p->get_attribute( 'aria-hidden' ) );
345+
$this->assertSame( '<div aria-hidden="false" data-wp-bind--aria-hidden="myPlugin::state.isOpen">Text</div>', $new_html );
344346

345347
$html = '<div data-is-closed="true" data-wp-bind--data-is-closed="myPlugin::state.isOpen">Text</div>';
346348
list($p, $new_html) = $this->process_directives( $html );
347-
$this->assertEquals( 'false', $p->get_attribute( 'data-is-closed' ) );
348-
$this->assertEquals( '<div data-is-closed="false" data-wp-bind--data-is-closed="myPlugin::state.isOpen">Text</div>', $new_html );
349+
$this->assertSame( 'false', $p->get_attribute( 'data-is-closed' ) );
350+
$this->assertSame( '<div data-is-closed="false" data-wp-bind--data-is-closed="myPlugin::state.isOpen">Text</div>', $new_html );
349351
}
350352

351353
/**
@@ -375,8 +377,21 @@ public function test_wp_bind_removes_value_if_null_in_aria_or_data_attributes()
375377
public function test_wp_bind_handles_nested_bindings() {
376378
$html = '<div data-wp-bind--id="myPlugin::state.id"><img data-wp-bind--width="myPlugin::state.width"></div>';
377379
list($p) = $this->process_directives( $html );
378-
$this->assertEquals( 'some-id', $p->get_attribute( 'id' ) );
380+
$this->assertSame( 'some-id', $p->get_attribute( 'id' ) );
379381
$p->next_tag();
380-
$this->assertEquals( '100', $p->get_attribute( 'width' ) );
382+
$this->assertSame( '100', $p->get_attribute( 'width' ) );
383+
}
384+
385+
/**
386+
* Tests handling bindings to boolean values.
387+
*
388+
* @ticket 60758
389+
*
390+
* @covers ::process_directives
391+
*/
392+
public function test_wp_bind_handles_true_value() {
393+
$html = '<div data-wp-bind--id="myPlugin::state.trueValue"></div>';
394+
list($p) = $this->process_directives( $html );
395+
$this->assertSame( true, $p->get_attribute( 'id' ) );
381396
}
382397
}

0 commit comments

Comments
 (0)