Yesterday we started building an addon that will display a list of items from Daily Drip's RSS feed. We wrote some tests and built a little bit of the addon but we didn't see the addon operate at all. As it currently stands, there isn't a lot to see from our addon, but that doesn't mean that we can't get it running.
In our addon we have a dummy app that we can use for acceptance tests. This app
has access to our addon and if we want to run it, all we have to do is cd to
tests/dummy
and run
ember s
just as we would with a normal app. Also, we
should probably open our
package.json
in the addon root and remove the
ember-welcome-page
addon. Then let's create an application template in our
dummy app and add our addon's component.
tests/dummy/app/templates/application.hbs
<h1>Application template</h1>
{{daily-drip-feed}}
That is all we have to do for our running dummy app to display our addon's
component. In our case, our component as it currently exists doesn't actually
display anything. To verify it is working we can just add some text to our
addon/templates/components/daily-drip-feed.hbs
and we will see it at
http://localhost:4200.
A couple of small details are worth noting here. The index.js file in your addon's root directory is the entry point for your addon. It exports an object with some properties about your addon. This is also where your addon's name is specified.
If we are developing an addon for an Ember project that already exists, we can
link our addon with a consuming application locally by using
npm link
. To do
this, from inside of your addon type
npm link
. Then from inside your consuming
application, you will type
npm link ${addon-name}
. Finally, in your consuming
application's
package.json
add the addon. In our case:
"ember-daily-drip-feed": "*"
. Now, our app will be able to consume our addon
while we are developing both.
There is one more cool feature of Ember addons that we are going to look at today. Ember Try. Ember CLI addons now come with Ember Try bundled. This allows us to test our addon against different versions of Ember. As an addon author, we don't know what version of Ember folks will be using who are consuming our addon. But since we can test against various versions we can make it clear what versions our addon will work with.
To run our tests using Ember Try we just run
npm test
. By default your tests
will be run again 1.13, the current release, beta, and canary. If you want to
customize what versions are run, you can make changes to
config/ember-try.js
.
That is it for today. Tomorrow we will create a service to fetch the RSS feed and give it back to the component to display. See you then.
Comments for Linking your addon locally and running tests