diff --git a/addon/components/materialize-badge.js b/addon/components/materialize-badge.js new file mode 100644 index 00000000..e321f420 --- /dev/null +++ b/addon/components/materialize-badge.js @@ -0,0 +1,9 @@ +import Ember from 'ember'; +import layout from '../templates/components/materialize-badge'; + +export default Ember.Component.extend({ + layout: layout, + tagName: 'span', + text: null, + classNames: ['badge'] +}); diff --git a/addon/templates/components/materialize-badge.hbs b/addon/templates/components/materialize-badge.hbs new file mode 100644 index 00000000..36fa1d69 --- /dev/null +++ b/addon/templates/components/materialize-badge.hbs @@ -0,0 +1 @@ +{{text}}{{yield}} diff --git a/app/components/materialize-badge.js b/app/components/materialize-badge.js new file mode 100644 index 00000000..7e973ae6 --- /dev/null +++ b/app/components/materialize-badge.js @@ -0,0 +1,3 @@ +import materializeBadge from 'ember-cli-materialize/components/materialize-badge'; + +export default materializeBadge; diff --git a/tests/dummy/app/router.js b/tests/dummy/app/router.js index 5bd70d4a..83499aae 100644 --- a/tests/dummy/app/router.js +++ b/tests/dummy/app/router.js @@ -6,6 +6,7 @@ var Router = Ember.Router.extend({ }); Router.map(function() { + this.route("badges"); this.route("buttons"); this.route("navbar"); this.route("cards"); diff --git a/tests/dummy/app/templates/badges.hbs b/tests/dummy/app/templates/badges.hbs new file mode 100644 index 00000000..0d66e543 --- /dev/null +++ b/tests/dummy/app/templates/badges.hbs @@ -0,0 +1,49 @@ +
+
+
+
+

Badges

+
+
+
+
+ +
+
+
+

The component supports one option:

+
    +
  • text, default value null
    • +
+
+
+
+
+
+
    +
  • + 1. Steal Underpants + {{materialize-badge class='new' text="6"}} +
    • +
  • 2. ??? + {{#materialize-badge}}9{{/materialize-badge}} +
    • +
  • 3. Profit
    • +
+
+
+
+
+ + 
+          
+            {{materialize-badge class="new" text="6"}}
+            {{#materialize-badge}}9{{/materialize-badge}}
+          
+
+ +
+
+
+ +
diff --git a/tests/dummy/app/templates/index.hbs b/tests/dummy/app/templates/index.hbs index b89f03c7..c842b016 100644 --- a/tests/dummy/app/templates/index.hbs +++ b/tests/dummy/app/templates/index.hbs @@ -30,12 +30,35 @@

Usage

diff --git a/tests/unit/components/materialize-badge-test.js b/tests/unit/components/materialize-badge-test.js new file mode 100644 index 00000000..b4ea053b --- /dev/null +++ b/tests/unit/components/materialize-badge-test.js @@ -0,0 +1,40 @@ +import Ember from 'ember'; + +import { + moduleForComponent, + test +} from 'ember-qunit'; + +moduleForComponent('materialize-badge', { + // Specify the other units that are required for this test + // needs: ['component:foo', 'helper:bar'] +}); + +test('it renders', function(assert) { + assert.expect(2); + + // Creates the component instance + var component = this.subject(); + assert.equal(component._state, 'preRender'); + + // Renders the component to the page + this.render(); + assert.equal(component._state, 'inDOM'); +}); + + +test('binding to the text property works', function(assert) { + assert.expect(2); + + var component = this.subject(); + + this.render(); + assert.equal(component.$().text().trim(), '', 'By default the text property is empty'); + + Ember.run(function () { + component.set('text', 'Heisenberg'); + Ember.run.schedule('afterRender', function () { + assert.equal(component.$().text().trim(), 'Heisenberg', 'Setting the text property updates the content of the badge'); + }); + }); +});