diff --git a/CHANGELOG.md b/CHANGELOG.md
index b3fc0bbb..ce8dd4af 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,23 @@
# Changelog
+## v2.1.0 (2019-03-15)
+
+#### :rocket: Enhancement
+* [#323](https://github.com/simplabs/ember-test-selectors/pull/323) Handle components with empty tag name ([@ssutar](https://github.com/ssutar))
+
+#### :bug: Bug Fix
+* [#292](https://github.com/simplabs/ember-test-selectors/pull/292) Only strip attribute *starting* with `data-test-` ([@bendemboski](https://github.com/bendemboski))
+
+#### :house: Internal
+* [#315](https://github.com/simplabs/ember-test-selectors/pull/315) tests: Check that `link-to` bindings work properly ([@Turbo87](https://github.com/Turbo87))
+* [#285](https://github.com/simplabs/ember-test-selectors/pull/285) TravisCI: Remove deprecated `sudo: false` option ([@Turbo87](https://github.com/Turbo87))
+
+#### Committers: 3
+- Ben Demboski ([@bendemboski](https://github.com/bendemboski))
+- Santosh Sutar ([@ssutar](https://github.com/ssutar))
+- Tobias Bieniek ([@Turbo87](https://github.com/Turbo87))
+
+
## v2.0.0 (2018-10-23)
#### :boom: Breaking Change
diff --git a/README.md b/README.md
index 9eae6aca..fcc5a1db 100644
--- a/README.md
+++ b/README.md
@@ -121,6 +121,49 @@ export default Ember.Component({
As with `data-test-*` attributes in the templates, these properties, whether
computed or not, will be removed automatically in production builds.
+### Usage with tagless components
+
+Since tagless components do not have a root element, `data-test-*` attributes
+passed to them cannot be bound to the DOM. If you try to pass a `data-test-*`
+attribute to a tagless component, or define one in its Javascript class,
+`ember-test-selectors` will throw an assertion error.
+
+However, there are some cases where you might want to pass a `data-test-*`
+attribute to a tagless component, for example a tagless wrapper component:
+
+```js
+// comment-wrapper.js
+export default Ember.Component({
+ tagName: ''
+})
+```
+
+```hbs
+{{!-- comment-wrapper.hbs --}}
+Comment:
+{{comment-list-item comment=comment data-test-comment-id=data-test-comment-id}}
+```
+
+```handlebars
+{{!-- comment-list.hbs --}}
+{{#each comments as |comment|}}
+ {{comment-wrapper comment=comment data-test-comment-id=comment.id}}
+{{/each}}
+```
+
+In this case, to prevent the assertion on the specific `comment-wrapper`
+component, you can specify `supportsDataTestProperties` on the class:
+
+```js
+// comment-wrapper.js
+export default Ember.Component({
+ tagName: '',
+ supportsDataTestProperties: true
+})
+```
+
+`supportsDataTestProperties`, like `data-test-*` properties, will be stripped
+from the build.
Configuration
------------------------------------------------------------------------------
diff --git a/addon/utils/bind-data-test-attributes.js b/addon/utils/bind-data-test-attributes.js
index c2bfd0be..3083f8f0 100644
--- a/addon/utils/bind-data-test-attributes.js
+++ b/addon/utils/bind-data-test-attributes.js
@@ -17,8 +17,14 @@ export default function bindDataTestAttributes(component) {
let tagName = component.get('tagName');
+ if (component.get('supportsDataTestProperties') && tagName === '') {
+ return;
+ }
+
let message = `ember-test-selectors could not bind data-test-* properties on ${component} ` +
- `automatically because tagName is empty.`;
+ `automatically because tagName is empty. If you did this intentionally, see ` +
+ `https://github.com/simplabs/ember-test-selectors#usage-in-computed-properties ` +
+ `for instructions on how to disable this assertion.`;
assert(message, tagName !== '', {
id: 'ember-test-selectors.empty-tag-name',
diff --git a/node-tests/fixtures/default/expected.js b/node-tests/fixtures/default/expected.js
index f85bb7c9..22c1e490 100644
--- a/node-tests/fixtures/default/expected.js
+++ b/node-tests/fixtures/default/expected.js
@@ -15,4 +15,7 @@ exports['default'] = _ember2['default'].Component.extend({
'data-test': 'test',
'metadata-test-foo': 'metadata'
});
-module.exports = exports['default'];
+var c2 = _ember2['default'].Component.extend({
+ foo: 'foo'
+});
+exports.c2 = c2;
diff --git a/node-tests/fixtures/default/expected6.js b/node-tests/fixtures/default/expected6.js
index e9a85a3a..c70dff67 100644
--- a/node-tests/fixtures/default/expected6.js
+++ b/node-tests/fixtures/default/expected6.js
@@ -5,3 +5,7 @@ export default Ember.Component.extend({
'data-test': 'test',
'metadata-test-foo': 'metadata'
});
+
+export let c2 = Ember.Component.extend({
+ foo: 'foo'
+});
diff --git a/node-tests/fixtures/default/expected7.js b/node-tests/fixtures/default/expected7.js
index 73bb5901..9b5e1aa9 100644
--- a/node-tests/fixtures/default/expected7.js
+++ b/node-tests/fixtures/default/expected7.js
@@ -4,3 +4,6 @@ export default Ember.Component.extend({
'data-test': 'test',
'metadata-test-foo': 'metadata'
});
+export let c2 = Ember.Component.extend({
+ foo: 'foo'
+});
diff --git a/node-tests/fixtures/default/fixture.js b/node-tests/fixtures/default/fixture.js
index de6430b4..282952a3 100644
--- a/node-tests/fixtures/default/fixture.js
+++ b/node-tests/fixtures/default/fixture.js
@@ -8,4 +8,10 @@ export default Ember.Component.extend({
'data-test-foobar': Ember.computed('data-test-foo', function() {
return `${this.get('data-test-foo')}bar`
}),
+ supportsDataTestProperties: true
+});
+
+export let c2 = Ember.Component.extend({
+ foo: 'foo',
+ 'supportsDataTestProperties': true
});
diff --git a/package.json b/package.json
index 205e6f4a..352fba4c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "ember-test-selectors",
- "version": "2.0.0",
+ "version": "2.1.0",
"description": "Enabling better Test selectors in Ember.js applications.",
"keywords": [
"ember-addon"
diff --git a/strip-data-test-properties-plugin.js b/strip-data-test-properties-plugin.js
index 678f5c4d..1841b57c 100644
--- a/strip-data-test-properties-plugin.js
+++ b/strip-data-test-properties-plugin.js
@@ -3,12 +3,14 @@
/* eslint-env node */
let TEST_SELECTOR_PREFIX = /^data-test-.*/;
+let SUPPORTS_DATA_TEST_PROP = 'supportsDataTestProperties';
function StripDataTestPropertiesPlugin(babel) {
return new babel.Plugin('ember-test-selectors', {
visitor: {
Property(node) {
- if (TEST_SELECTOR_PREFIX.test(node.key.value)) {
+ let nodeName = node.key.name || node.key.value;
+ if (TEST_SELECTOR_PREFIX.test(nodeName) || nodeName === SUPPORTS_DATA_TEST_PROP) {
this.dangerouslyRemove();
}
},
diff --git a/strip-data-test-properties-plugin6.js b/strip-data-test-properties-plugin6.js
index 62308338..b823d095 100644
--- a/strip-data-test-properties-plugin6.js
+++ b/strip-data-test-properties-plugin6.js
@@ -3,12 +3,14 @@
/* eslint-env node */
let TEST_SELECTOR_PREFIX = /^data-test-.*/;
+let SUPPORTS_DATA_TEST_PROP = 'supportsDataTestProperties';
function StripDataTestPropertiesPlugin() {
return {
visitor: {
Property(path) {
- if (TEST_SELECTOR_PREFIX.test(path.node.key.value)) {
+ let nodeName = path.node.key.name || path.node.key.value;
+ if (TEST_SELECTOR_PREFIX.test(nodeName) || nodeName === SUPPORTS_DATA_TEST_PROP) {
path.remove();
}
},
diff --git a/tests/acceptance/bind-data-test-attributes-in-components-test.js b/tests/acceptance/bind-data-test-attributes-in-components-test.js
index d778a42d..017025e8 100644
--- a/tests/acceptance/bind-data-test-attributes-in-components-test.js
+++ b/tests/acceptance/bind-data-test-attributes-in-components-test.js
@@ -72,4 +72,9 @@ if (!config.stripTestSelectors) {
assert.dom('.test-link-to-block a').hasAttribute('data-test-foo', 'bar');
assert.dom('.test-link-to-inline a').hasAttribute('data-test-foo', 'bar');
});
+
+ test('it handles the tagless components without assert when `supportsDataTestProperties` is set', function(assert) {
+ assert.dom('.test12 div[data-test-with-boolean-value]').doesNotExist('data-test-with-boolean-value does not exist');
+ assert.dom('.test13 div[data-test-without-value]').doesNotExist('data-test-without-value does not exist');
+ });
}
diff --git a/tests/dummy/app/components/tagless-component.js b/tests/dummy/app/components/tagless-component.js
new file mode 100644
index 00000000..c242cbe7
--- /dev/null
+++ b/tests/dummy/app/components/tagless-component.js
@@ -0,0 +1,9 @@
+import Component from '@ember/component';
+
+export default Component.extend({
+ // we're explicitly setting attributeBindings here to test that
+ // we are correctly slice()ing the frozen array if it exists already
+ attributeBindings: [],
+ tagName: '',
+ supportsDataTestProperties: true,
+});
diff --git a/tests/dummy/app/templates/bind-test.hbs b/tests/dummy/app/templates/bind-test.hbs
index f1360b6d..ab4759ff 100644
--- a/tests/dummy/app/templates/bind-test.hbs
+++ b/tests/dummy/app/templates/bind-test.hbs
@@ -24,4 +24,8 @@
{{#link-to "index" data-test-foo="bar"}}Label{{/link-to}}
-{{link-to "Label" "index" data-test-foo="bar"}}
\ No newline at end of file
+{{link-to "Label" "index" data-test-foo="bar"}}
+
+{{tagless-component data-test-with-boolean-value=true}}
+
+{{tagless-component data-test-without-value}}
diff --git a/tests/dummy/app/templates/components/tagless-component.hbs b/tests/dummy/app/templates/components/tagless-component.hbs
new file mode 100644
index 00000000..5b9b42c8
--- /dev/null
+++ b/tests/dummy/app/templates/components/tagless-component.hbs
@@ -0,0 +1,4 @@
+"Please disperse. Nothing to see here." - Frank Drebin
+
+This component only exists so we can convenietly use moduleForComponent for the
+tests which check that data-test-* attributes are stripped.
diff --git a/tests/unit/utils/bind-data-test-attributes-test.js b/tests/unit/utils/bind-data-test-attributes-test.js
index 37c39a38..06625123 100644
--- a/tests/unit/utils/bind-data-test-attributes-test.js
+++ b/tests/unit/utils/bind-data-test-attributes-test.js
@@ -129,6 +129,21 @@ test('it breaks if tagName is empty', function(assert) {
assert.throws(() => bindDataTestAttributes(instance));
});
+test('it does not breaks if tagName is empty and supportsDataTestProperties is set', function(assert) {
+ assert.expect(0);
+
+ let Fixture = EmberObject.extend({
+ tagName: '',
+ supportsDataTestProperties: true,
+ 'data-test-from-factory': 'foo',
+ });
+ let instance = Fixture.create({
+ 'data-test-from-invocation': 'bar',
+ });
+
+ bindDataTestAttributes(instance);
+});
+
test('issue #106', function(assert) {
let Component = EmberObject.extend({});