├── app ├── .gitkeep └── components │ ├── deferred-content.js │ └── deferred-content │ ├── pending-content.js │ ├── settled-content.js │ ├── fulfilled-content.js │ └── rejected-content.js ├── addon ├── .gitkeep ├── templates │ └── components │ │ ├── deferred-content │ │ ├── settled-content.hbs │ │ ├── fulfilled-content.hbs │ │ ├── pending-content.hbs │ │ └── rejected-content.hbs │ │ └── deferred-content.hbs └── components │ ├── deferred-content │ ├── pending-content.js │ ├── settled-content.js │ ├── fulfilled-content.js │ └── rejected-content.js │ └── deferred-content.js ├── vendor └── .gitkeep ├── tests ├── integration │ ├── .gitkeep │ └── deferred-content-test.js ├── dummy │ ├── app │ │ ├── helpers │ │ │ └── .gitkeep │ │ ├── models │ │ │ └── .gitkeep │ │ ├── routes │ │ │ └── .gitkeep │ │ ├── styles │ │ │ └── app.css │ │ ├── components │ │ │ └── .gitkeep │ │ ├── controllers │ │ │ └── .gitkeep │ │ ├── templates │ │ │ ├── components │ │ │ │ └── .gitkeep │ │ │ └── application.hbs │ │ ├── resolver.js │ │ ├── router.js │ │ ├── app.js │ │ └── index.html │ ├── public │ │ ├── robots.txt │ │ └── crossdomain.xml │ └── config │ │ ├── targets.js │ │ └── environment.js ├── .eslintrc.js ├── helpers │ ├── destroy-app.js │ ├── resolver.js │ ├── start-app.js │ └── module-for-acceptance.js ├── test-helper.js ├── .jshintrc └── index.html ├── .watchmanconfig ├── bors.toml ├── .bowerrc ├── index.js ├── config ├── environment.js └── ember-try.js ├── .ember-cli ├── .npmignore ├── .gitignore ├── .editorconfig ├── ember-cli-build.js ├── testem.js ├── .jshintrc ├── LICENSE.md ├── .eslintrc.js ├── .travis.yml ├── package.json └── README.md /app/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /addon/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /vendor/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/integration/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/dummy/app/helpers/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/dummy/app/models/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/dummy/app/routes/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/dummy/app/styles/app.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/dummy/app/components/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/dummy/app/controllers/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/dummy/app/templates/components/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.watchmanconfig: -------------------------------------------------------------------------------- 1 | { 2 | "ignore_dirs": ["tmp", "dist"] 3 | } 4 | -------------------------------------------------------------------------------- /bors.toml: -------------------------------------------------------------------------------- 1 | status = [ 2 | "continuous-integration/travis-ci/push" 3 | ] 4 | -------------------------------------------------------------------------------- /.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "bower_components", 3 | "analytics": false 4 | } 5 | -------------------------------------------------------------------------------- /tests/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | env: { 3 | embertest: true 4 | } 5 | }; 6 | -------------------------------------------------------------------------------- /tests/dummy/public/robots.txt: -------------------------------------------------------------------------------- 1 | # http://www.robotstxt.org 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | module.exports = { 4 | name: 'ember-deferred-content' 5 | }; 6 | -------------------------------------------------------------------------------- /addon/templates/components/deferred-content/settled-content.hbs: -------------------------------------------------------------------------------- 1 | {{#if isSettled}}{{yield}}{{/if}} 2 | -------------------------------------------------------------------------------- /tests/dummy/app/resolver.js: -------------------------------------------------------------------------------- 1 | import Resolver from 'ember-resolver'; 2 | 3 | export default Resolver; 4 | -------------------------------------------------------------------------------- /addon/templates/components/deferred-content/fulfilled-content.hbs: -------------------------------------------------------------------------------- 1 | {{#if isFulfilled}}{{yield result}}{{/if}} 2 | -------------------------------------------------------------------------------- /addon/templates/components/deferred-content/pending-content.hbs: -------------------------------------------------------------------------------- 1 | {{#unless isSettled}}{{yield}}{{/unless}} 2 | -------------------------------------------------------------------------------- /addon/templates/components/deferred-content/rejected-content.hbs: -------------------------------------------------------------------------------- 1 | {{#if isRejected}}{{yield result}}{{/if}} 2 | -------------------------------------------------------------------------------- /app/components/deferred-content.js: -------------------------------------------------------------------------------- 1 | export { default } from 'ember-deferred-content/components/deferred-content'; 2 | -------------------------------------------------------------------------------- /config/environment.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | module.exports = function(/* environment, appConfig */) { 4 | return { }; 5 | }; 6 | -------------------------------------------------------------------------------- /app/components/deferred-content/pending-content.js: -------------------------------------------------------------------------------- 1 | export { default } from 'ember-deferred-content/components/deferred-content/pending-content'; 2 | -------------------------------------------------------------------------------- /app/components/deferred-content/settled-content.js: -------------------------------------------------------------------------------- 1 | export { default } from 'ember-deferred-content/components/deferred-content/settled-content'; 2 | -------------------------------------------------------------------------------- /app/components/deferred-content/fulfilled-content.js: -------------------------------------------------------------------------------- 1 | export { default } from 'ember-deferred-content/components/deferred-content/fulfilled-content'; 2 | -------------------------------------------------------------------------------- /app/components/deferred-content/rejected-content.js: -------------------------------------------------------------------------------- 1 | export { default } from 'ember-deferred-content/components/deferred-content/rejected-content'; 2 | -------------------------------------------------------------------------------- /tests/helpers/destroy-app.js: -------------------------------------------------------------------------------- 1 | import { run } from '@ember/runloop'; 2 | 3 | export default function destroyApp(application) { 4 | run(application, 'destroy'); 5 | } 6 | -------------------------------------------------------------------------------- /tests/dummy/app/templates/application.hbs: -------------------------------------------------------------------------------- 1 | {{!-- The following component displays Ember's default welcome message. --}} 2 | {{welcome-page}} 3 | {{!-- Feel free to remove this! --}} 4 | 5 | {{outlet}} -------------------------------------------------------------------------------- /addon/components/deferred-content/pending-content.js: -------------------------------------------------------------------------------- 1 | import Component from '@ember/component'; 2 | import layout from '../../templates/components/deferred-content/pending-content'; 3 | 4 | export default Component.extend({ 5 | layout, 6 | tagName: '' 7 | }); 8 | -------------------------------------------------------------------------------- /addon/components/deferred-content/settled-content.js: -------------------------------------------------------------------------------- 1 | import Component from '@ember/component'; 2 | import layout from '../../templates/components/deferred-content/settled-content'; 3 | 4 | export default Component.extend({ 5 | layout, 6 | tagName: '' 7 | }); 8 | -------------------------------------------------------------------------------- /addon/components/deferred-content/fulfilled-content.js: -------------------------------------------------------------------------------- 1 | import Component from '@ember/component'; 2 | import layout from '../../templates/components/deferred-content/fulfilled-content'; 3 | 4 | export default Component.extend({ 5 | layout, 6 | tagName: '' 7 | }); 8 | -------------------------------------------------------------------------------- /addon/components/deferred-content/rejected-content.js: -------------------------------------------------------------------------------- 1 | import Component from '@ember/component'; 2 | import layout from '../../templates/components/deferred-content/rejected-content'; 3 | 4 | export default Component.extend({ 5 | layout, 6 | tagName: '' 7 | }); 8 | -------------------------------------------------------------------------------- /tests/test-helper.js: -------------------------------------------------------------------------------- 1 | import Application from '../app'; 2 | import config from '../config/environment'; 3 | import { setApplication } from '@ember/test-helpers'; 4 | import { start } from 'ember-qunit'; 5 | 6 | setApplication(Application.create(config.APP)); 7 | 8 | start(); 9 | -------------------------------------------------------------------------------- /tests/dummy/app/router.js: -------------------------------------------------------------------------------- 1 | import EmberRouter from '@ember/routing/router'; 2 | import config from './config/environment'; 3 | 4 | const Router = EmberRouter.extend({ 5 | location: config.locationType, 6 | rootURL: config.rootURL 7 | }); 8 | 9 | Router.map(function() { 10 | }); 11 | 12 | export default Router; 13 | -------------------------------------------------------------------------------- /.ember-cli: -------------------------------------------------------------------------------- 1 | { 2 | /** 3 | Ember CLI sends analytics information by default. The data is completely 4 | anonymous, but there are times when you might want to disable this behavior. 5 | 6 | Setting `disableAnalytics` to true will prevent any data from being sent. 7 | */ 8 | "disableAnalytics": false 9 | } 10 | -------------------------------------------------------------------------------- /tests/helpers/resolver.js: -------------------------------------------------------------------------------- 1 | import Resolver from '../../resolver'; 2 | import config from '../../config/environment'; 3 | 4 | const resolver = Resolver.create(); 5 | 6 | resolver.namespace = { 7 | modulePrefix: config.modulePrefix, 8 | podModulePrefix: config.podModulePrefix 9 | }; 10 | 11 | export default resolver; 12 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | /bower_components 2 | /config/ember-try.js 3 | /dist 4 | /tests 5 | /tmp 6 | **/.gitkeep 7 | .bowerrc 8 | .editorconfig 9 | .ember-cli 10 | .eslintrc.js 11 | .gitignore 12 | .watchmanconfig 13 | .travis.yml 14 | bower.json 15 | ember-cli-build.js 16 | testem.js 17 | 18 | # ember-try 19 | .node_modules.ember-try/ 20 | bower.json.ember-try 21 | package.json.ember-try 22 | -------------------------------------------------------------------------------- /tests/dummy/config/targets.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const browsers = [ 4 | 'last 1 Chrome versions', 5 | 'last 1 Firefox versions', 6 | 'last 1 Safari versions' 7 | ]; 8 | 9 | const isCI = !!process.env.CI; 10 | const isProduction = process.env.EMBER_ENV === 'production'; 11 | 12 | if (isCI || isProduction) { 13 | browsers.push('ie 11'); 14 | } 15 | 16 | module.exports = { 17 | browsers 18 | }; 19 | -------------------------------------------------------------------------------- /tests/dummy/app/app.js: -------------------------------------------------------------------------------- 1 | import Application from '@ember/application'; 2 | import Resolver from './resolver'; 3 | import loadInitializers from 'ember-load-initializers'; 4 | import config from './config/environment'; 5 | 6 | const App = Application.extend({ 7 | modulePrefix: config.modulePrefix, 8 | podModulePrefix: config.podModulePrefix, 9 | Resolver 10 | }); 11 | 12 | loadInitializers(App, config.modulePrefix); 13 | 14 | export default App; 15 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | 7 | # dependencies 8 | /node_modules 9 | /bower_components 10 | 11 | # misc 12 | /.sass-cache 13 | /connect.lock 14 | /coverage/* 15 | /libpeerconnection.log 16 | npm-debug.log* 17 | yarn-error.log 18 | testem.log 19 | 20 | # ember-try 21 | .node_modules.ember-try/ 22 | bower.json.ember-try 23 | package.json.ember-try 24 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent 2 | # coding styles between different editors and IDEs 3 | # editorconfig.org 4 | 5 | root = true 6 | 7 | 8 | [*] 9 | end_of_line = lf 10 | charset = utf-8 11 | trim_trailing_whitespace = true 12 | insert_final_newline = true 13 | indent_style = space 14 | indent_size = 2 15 | 16 | [*.hbs] 17 | insert_final_newline = false 18 | 19 | [*.{diff,md}] 20 | trim_trailing_whitespace = false 21 | -------------------------------------------------------------------------------- /ember-cli-build.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const EmberAddon = require('ember-cli/lib/broccoli/ember-addon'); 4 | 5 | module.exports = function(defaults) { 6 | let app = new EmberAddon(defaults, { 7 | // Add options here 8 | }); 9 | 10 | /* 11 | This build file specifies the options for the dummy test app of this 12 | addon, located in `/tests/dummy` 13 | This build file does *not* influence how the addon or the app using it 14 | behave. You most likely want to be modifying `./index.js` or app's build file 15 | */ 16 | 17 | return app.toTree(); 18 | }; 19 | -------------------------------------------------------------------------------- /tests/helpers/start-app.js: -------------------------------------------------------------------------------- 1 | import Application from '../../app'; 2 | import config from '../../config/environment'; 3 | import { merge } from '@ember/polyfills'; 4 | import { run } from '@ember/runloop'; 5 | 6 | export default function startApp(attrs) { 7 | let attributes = merge({}, config.APP); 8 | attributes = merge(attributes, attrs); // use defaults, but you can override; 9 | 10 | return run(() => { 11 | let application = Application.create(attributes); 12 | application.setupForTesting(); 13 | application.injectTestHelpers(); 14 | return application; 15 | }); 16 | } 17 | -------------------------------------------------------------------------------- /testem.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | test_page: 'tests/index.html?hidepassed', 3 | disable_watching: true, 4 | launch_in_ci: [ 5 | 'Chrome' 6 | ], 7 | launch_in_dev: [ 8 | 'Chrome' 9 | ], 10 | browser_args: { 11 | Chrome: { 12 | mode: 'ci', 13 | args: [ 14 | // --no-sandbox is needed when running Chrome inside a container 15 | process.env.TRAVIS ? '--no-sandbox' : null, 16 | 17 | '--disable-gpu', 18 | '--headless', 19 | '--remote-debugging-port=0', 20 | '--window-size=1440,900' 21 | ].filter(Boolean) 22 | } 23 | } 24 | }; 25 | -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "predef": [ 3 | "document", 4 | "window", 5 | "-Promise" 6 | ], 7 | "browser": true, 8 | "boss": true, 9 | "curly": true, 10 | "debug": false, 11 | "devel": true, 12 | "eqeqeq": true, 13 | "evil": true, 14 | "forin": false, 15 | "immed": false, 16 | "laxbreak": false, 17 | "newcap": true, 18 | "noarg": true, 19 | "noempty": false, 20 | "nonew": false, 21 | "nomen": false, 22 | "onevar": false, 23 | "plusplus": false, 24 | "regexp": false, 25 | "undef": true, 26 | "sub": true, 27 | "strict": false, 28 | "white": false, 29 | "eqnull": true, 30 | "esversion": 6, 31 | "unused": true 32 | } 33 | -------------------------------------------------------------------------------- /addon/templates/components/deferred-content.hbs: -------------------------------------------------------------------------------- 1 | {{yield (hash pending=(component 'deferred-content/pending-content' isSettled=isSettled) 2 | fulfilled=(component 'deferred-content/fulfilled-content' isFulfilled=isFulfilled result=content) 3 | rejected=(component 'deferred-content/rejected-content' isRejected=isRejected result=content) 4 | settled=(component 'deferred-content/settled-content' isSettled=isSettled) 5 | isPending=isPending 6 | isSettled=isSettled 7 | isRejected=isRejected 8 | isFulfilled=isFulfilled 9 | content=content 10 | ) 11 | }} 12 | -------------------------------------------------------------------------------- /tests/dummy/public/crossdomain.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 15 | 16 | -------------------------------------------------------------------------------- /tests/helpers/module-for-acceptance.js: -------------------------------------------------------------------------------- 1 | import { module } from 'qunit'; 2 | import { resolve } from 'rsvp'; 3 | import startApp from '../helpers/start-app'; 4 | import destroyApp from '../helpers/destroy-app'; 5 | 6 | export default function(name, options = {}) { 7 | module(name, { 8 | beforeEach() { 9 | this.application = startApp(); 10 | 11 | if (options.beforeEach) { 12 | return options.beforeEach.apply(this, arguments); 13 | } 14 | }, 15 | 16 | afterEach() { 17 | let afterEach = options.afterEach && options.afterEach.apply(this, arguments); 18 | return resolve(afterEach).then(() => destroyApp(this.application)); 19 | } 20 | }); 21 | } 22 | -------------------------------------------------------------------------------- /tests/dummy/app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Dummy 7 | 8 | 9 | 10 | {{content-for "head"}} 11 | 12 | 13 | 14 | 15 | {{content-for "head-footer"}} 16 | 17 | 18 | {{content-for "body"}} 19 | 20 | 21 | 22 | 23 | {{content-for "body-footer"}} 24 | 25 | 26 | -------------------------------------------------------------------------------- /tests/.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "predef": [ 3 | "document", 4 | "window", 5 | "location", 6 | "setTimeout", 7 | "$", 8 | "-Promise", 9 | "define", 10 | "console", 11 | "visit", 12 | "exists", 13 | "fillIn", 14 | "click", 15 | "keyEvent", 16 | "triggerEvent", 17 | "find", 18 | "findWithAssert", 19 | "wait", 20 | "DS", 21 | "andThen", 22 | "currentURL", 23 | "currentPath", 24 | "currentRouteName" 25 | ], 26 | "node": false, 27 | "browser": false, 28 | "boss": true, 29 | "curly": true, 30 | "debug": false, 31 | "devel": false, 32 | "eqeqeq": true, 33 | "evil": true, 34 | "forin": false, 35 | "immed": false, 36 | "laxbreak": false, 37 | "newcap": true, 38 | "noarg": true, 39 | "noempty": false, 40 | "nonew": false, 41 | "nomen": false, 42 | "onevar": false, 43 | "plusplus": false, 44 | "regexp": false, 45 | "undef": true, 46 | "sub": true, 47 | "strict": false, 48 | "white": false, 49 | "eqnull": true, 50 | "esversion": 6, 51 | "unused": true 52 | } 53 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2017 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 6 | 7 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 8 | 9 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 10 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parserOptions: { 4 | ecmaVersion: 2017, 5 | sourceType: 'module' 6 | }, 7 | plugins: [ 8 | 'ember' 9 | ], 10 | extends: [ 11 | 'eslint:recommended', 12 | 'plugin:ember/recommended' 13 | ], 14 | env: { 15 | browser: true 16 | }, 17 | rules: { 18 | }, 19 | overrides: [ 20 | // node files 21 | { 22 | files: [ 23 | 'index.js', 24 | 'testem.js', 25 | 'ember-cli-build.js', 26 | 'config/**/*.js', 27 | 'tests/dummy/config/**/*.js' 28 | ], 29 | excludedFiles: [ 30 | 'app/**', 31 | 'addon/**', 32 | 'tests/dummy/app/**' 33 | ], 34 | parserOptions: { 35 | sourceType: 'script', 36 | ecmaVersion: 2015 37 | }, 38 | env: { 39 | browser: false, 40 | node: true 41 | }, 42 | plugins: ['node'], 43 | rules: Object.assign({}, require('eslint-plugin-node').configs.recommended.rules, { 44 | // add your custom rules and overrides for node files here 45 | }) 46 | } 47 | ] 48 | }; 49 | -------------------------------------------------------------------------------- /tests/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Dummy Tests 7 | 8 | 9 | 10 | {{content-for "head"}} 11 | {{content-for "test-head"}} 12 | 13 | 14 | 15 | 16 | 17 | {{content-for "head-footer"}} 18 | {{content-for "test-head-footer"}} 19 | 20 | 21 | {{content-for "body"}} 22 | {{content-for "test-body"}} 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | {{content-for "body-footer"}} 31 | {{content-for "test-body-footer"}} 32 | 33 | 34 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | --- 2 | language: node_js 3 | node_js: 4 | # we recommend testing addons with the same minimum supported node version as Ember CLI 5 | # so that your addon works for all apps 6 | - "lts/*" 7 | 8 | sudo: false 9 | dist: trusty 10 | 11 | addons: 12 | chrome: stable 13 | 14 | cache: 15 | yarn: true 16 | 17 | env: 18 | global: 19 | # See https://git.io/vdao3 for details. 20 | - JOBS=1 21 | matrix: 22 | # we recommend new addons test the current and previous LTS 23 | # as well as latest stable release (bonus points to beta/canary) 24 | - EMBER_TRY_SCENARIO=ember-lts-2.18 25 | - EMBER_TRY_SCENARIO=ember-release 26 | - EMBER_TRY_SCENARIO=ember-beta 27 | - EMBER_TRY_SCENARIO=ember-canary 28 | - EMBER_TRY_SCENARIO=ember-default 29 | 30 | matrix: 31 | fast_finish: true 32 | allow_failures: 33 | - env: EMBER_TRY_SCENARIO=ember-canary 34 | 35 | before_install: 36 | - curl -o- -L https://yarnpkg.com/install.sh | bash 37 | - export PATH=$HOME/.yarn/bin:$PATH 38 | 39 | install: 40 | - yarn install --no-lockfile --non-interactive 41 | 42 | script: 43 | - yarn lint:js 44 | # Usually, it's ok to finish the test scenario without reverting 45 | # to the addon's original dependency state, skipping "cleanup". 46 | - node_modules/.bin/ember try:one $EMBER_TRY_SCENARIO --skip-cleanup 47 | -------------------------------------------------------------------------------- /tests/dummy/config/environment.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | module.exports = function(environment) { 4 | let ENV = { 5 | modulePrefix: 'dummy', 6 | environment, 7 | rootURL: '/', 8 | locationType: 'auto', 9 | EmberENV: { 10 | FEATURES: { 11 | // Here you can enable experimental features on an ember canary build 12 | // e.g. 'with-controller': true 13 | }, 14 | EXTEND_PROTOTYPES: { 15 | // Prevent Ember Data from overriding Date.parse. 16 | Date: false 17 | } 18 | }, 19 | 20 | APP: { 21 | // Here you can pass flags/options to your application instance 22 | // when it is created 23 | } 24 | }; 25 | 26 | if (environment === 'development') { 27 | // ENV.APP.LOG_RESOLVER = true; 28 | // ENV.APP.LOG_ACTIVE_GENERATION = true; 29 | // ENV.APP.LOG_TRANSITIONS = true; 30 | // ENV.APP.LOG_TRANSITIONS_INTERNAL = true; 31 | // ENV.APP.LOG_VIEW_LOOKUPS = true; 32 | } 33 | 34 | if (environment === 'test') { 35 | // Testem prefers this... 36 | ENV.locationType = 'none'; 37 | 38 | // keep test console output quieter 39 | ENV.APP.LOG_ACTIVE_GENERATION = false; 40 | ENV.APP.LOG_VIEW_LOOKUPS = false; 41 | 42 | ENV.APP.rootElement = '#ember-testing'; 43 | ENV.APP.autoboot = false; 44 | } 45 | 46 | if (environment === 'production') { 47 | // here you can enable a production-specific feature 48 | } 49 | 50 | return ENV; 51 | }; 52 | -------------------------------------------------------------------------------- /addon/components/deferred-content.js: -------------------------------------------------------------------------------- 1 | import { assert } from '@ember/debug'; 2 | import Component from '@ember/component'; 3 | import { computed, get, set } from '@ember/object'; 4 | import { not } from '@ember/object/computed'; 5 | import layout from '../templates/components/deferred-content'; 6 | 7 | const DeferredContentComponent = Component.extend({ 8 | layout, 9 | isPending: not('isSettled'), 10 | tagName:'', 11 | promise: computed({ 12 | set(key, promise) { 13 | assert('You must pass a promise to ember-deferred-content', typeof promise.then === 'function'); 14 | set(this, 'isRejected', false); 15 | set(this, 'isFulfilled', false); 16 | set(this, 'isSettled', false); 17 | set(this, 'content', null); 18 | 19 | promise 20 | .then((result) => { 21 | if (!get(this, 'isDestroyed')) { 22 | set(this, 'isFulfilled', true); 23 | set(this, 'content', result); 24 | } 25 | }, (result) => { 26 | if (!get(this, 'isDestroyed')) { 27 | set(this, 'isRejected', true); 28 | set(this, 'content', result); 29 | } 30 | }) 31 | .finally(() => { 32 | if (!get(this, 'isDestroyed')) { 33 | set(this, 'isSettled', true); 34 | } 35 | }); 36 | 37 | return promise; 38 | } 39 | }) 40 | }); 41 | 42 | DeferredContentComponent.reopenClass({ 43 | positionalParams: ['promise'] 44 | }); 45 | 46 | export default DeferredContentComponent; 47 | -------------------------------------------------------------------------------- /config/ember-try.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const getChannelURL = require('ember-source-channel-url'); 4 | 5 | module.exports = function() { 6 | return Promise.all([ 7 | getChannelURL('release'), 8 | getChannelURL('beta'), 9 | getChannelURL('canary'), 10 | ]).then((urls) => { 11 | return { 12 | useYarn: true, 13 | scenarios: [ 14 | { 15 | name: 'ember-lts-2.12', 16 | npm: { 17 | devDependencies: { 18 | 'ember-source': '~2.12.0' 19 | } 20 | } 21 | }, 22 | { 23 | name: 'ember-lts-2.16', 24 | npm: { 25 | devDependencies: { 26 | 'ember-source': '~2.16.0' 27 | } 28 | } 29 | }, 30 | { 31 | name: 'ember-lts-2.18', 32 | npm: { 33 | devDependencies: { 34 | 'ember-source': '~2.18.0' 35 | } 36 | } 37 | }, 38 | { 39 | name: 'ember-release', 40 | npm: { 41 | devDependencies: { 42 | 'ember-source': urls[0] 43 | } 44 | } 45 | }, 46 | { 47 | name: 'ember-beta', 48 | npm: { 49 | devDependencies: { 50 | 'ember-source': urls[1] 51 | } 52 | } 53 | }, 54 | { 55 | name: 'ember-canary', 56 | npm: { 57 | devDependencies: { 58 | 'ember-source': urls[2] 59 | } 60 | } 61 | }, 62 | { 63 | name: 'ember-default', 64 | npm: { 65 | devDependencies: {} 66 | } 67 | } 68 | ] 69 | }; 70 | }); 71 | }; 72 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ember-deferred-content", 3 | "version": "1.0.0", 4 | "description": "Fancy pants handling of async content", 5 | "repository": "https://github.com/danmcclain/ember-deferred-content", 6 | "bugs": "https://github.com/danmcclain/ember-deferred-content/issues", 7 | "keywords": [ 8 | "ember-addon", 9 | "promises", 10 | "component" 11 | ], 12 | "license": "MIT", 13 | "author": "Dan McClain ", 14 | "directories": { 15 | "doc": "doc", 16 | "test": "tests" 17 | }, 18 | "scripts": { 19 | "build": "ember build", 20 | "lint:js": "eslint ./*.js addon addon-test-support app config lib server test-support tests", 21 | "start": "ember serve", 22 | "test": "ember try:each" 23 | }, 24 | "dependencies": { 25 | "ember-cli-babel": "^6.12.0", 26 | "ember-cli-htmlbars": "^2.0.1" 27 | }, 28 | "devDependencies": { 29 | "broccoli-asset-rev": "^3.0.0", 30 | "ember-ajax": "^3.1.0", 31 | "ember-cli": "~3.2.0", 32 | "ember-cli-dependency-checker": "^2.0.0", 33 | "ember-cli-eslint": "^4.2.1", 34 | "ember-cli-htmlbars-inline-precompile": "^2.0.0", 35 | "ember-cli-inject-live-reload": "^1.4.1", 36 | "ember-cli-qunit": "^4.3.2", 37 | "ember-cli-shims": "^1.2.0", 38 | "ember-cli-sri": "^2.1.0", 39 | "ember-cli-uglify": "^2.0.2", 40 | "ember-disable-prototype-extensions": "^1.1.2", 41 | "ember-export-application-global": "^2.0.0", 42 | "ember-load-initializers": "^1.0.0", 43 | "ember-maybe-import-regenerator": "^0.1.6", 44 | "ember-resolver": "^4.5.5", 45 | "ember-source": "~3.2.0", 46 | "ember-source-channel-url": "^1.0.1", 47 | "ember-try": "^1.0.0-beta.2", 48 | "ember-welcome-page": "^3.0.0", 49 | "eslint-plugin-ember": "^5.0.0", 50 | "eslint-plugin-node": "^7.0.0", 51 | "loader.js": "^4.2.3" 52 | }, 53 | "engines": { 54 | "node": "^4.5 || 6.* || >= 7.*" 55 | }, 56 | "ember-addon": { 57 | "configPath": "tests/dummy/config" 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # ember-deferred-content 2 | ## Fancy pants handling of async content 3 | 4 | [![Greenkeeper badge](https://badges.greenkeeper.io/danmcclain/ember-deferred-content.svg)](https://greenkeeper.io/) 5 | [![Build Status](https://travis-ci.org/danmcclain/ember-deferred-content.svg?branch=master)](https://travis-ci.org/danmcclain/ember-deferred-content) 6 | [![npm version](https://badge.fury.io/js/ember-deferred-content.svg)](https://badge.fury.io/js/ember-deferred-content) 7 | 8 | 9 | ```no-highlight 10 | ember install ember-deferred-content 11 | ``` 12 | 13 | ## Usage 14 | 15 | ```hbs 16 | {{! This assumes that post has an async relationship called comments}} 17 | {{#deferred-content post.comments as |d|}} 18 | {{#d.settled}} 19 |

Comments

20 | {{/d.settled}} 21 | {{#d.pending}} 22 | 23 | {{/d.pending}} 24 | {{#d.fulfilled as |comments|}} 25 | 30 | {{/d.fulfilled}} 31 | {{#d.rejected as |reason|}} 32 | Could not load comments: {{reason}} 33 | {{/d.rejected}} 34 | {{/deferred-content}} 35 | 36 | {{! or using ifs}} 37 | {{#deferred-content promise=post.comments as |d|}} 38 | {{#if d.isSettled}} 39 |

Comments

40 | {{/if}} 41 | {{#if d.isPending}} 42 | 43 | {{/if}} 44 | {{#if d.isFulfilled}} 45 | 50 | {{/if}} 51 | {{#if d.isRejected}} 52 | Could not load comments: {{d.content}} 53 | {{/if}} 54 | {{/deferred-content}} 55 | ``` 56 | 57 | `ember-deferred-content` takes the promise you need to resolve to show 58 | your content, and yields 4 subcomponents that you can use to show 59 | content during the different states of your promise 60 | 61 | - `d.settled`: displays the content when the promise is resolved or 62 | rejected 63 | - `d.pending`: displays the content before the promise is resolved or 64 | rejected 65 | - `d.fulfilled`: displays the content only when the promise is 66 | resolved; yields the result of the promise 67 | - `d.rejected`: displays the content only when the promise is rejected; 68 | yields the result of the promise 69 | 70 | It also sets a series of flags: 71 | 72 | - `d.isSettled`: true if the promise is resolved or rejected 73 | - `d.isPending`: true until the promise is resolved or rejected 74 | - `d.isFulfilled`: true if the promise is resolved 75 | - `d.isRejected`: true if the promise is rejected 76 | - `d.content`: the return value of the resolved/rejected state 77 | 78 | ## Compatibility 79 | 80 | This addon will work on Ember versions `2.3.x` and up only, due to use 81 | of [contextual 82 | components](http://emberjs.com/blog/2016/01/15/ember-2-3-released.html#toc_contextual-components) 83 | and the [`(hash` helper](http://emberjs.com/blog/2016/01/15/ember-2-3-released.html#toc_hash-helper). 84 | 85 | 86 | ## Developing 87 | 88 | * `git clone` this repository 89 | * `npm install` 90 | * `bower install` 91 | 92 | ## Running Tests 93 | 94 | * `npm test` (Runs `ember try:testall` to test your addon against multiple Ember versions) 95 | * `ember test` 96 | * `ember test --server` 97 | 98 | -------------------------------------------------------------------------------- /tests/integration/deferred-content-test.js: -------------------------------------------------------------------------------- 1 | import { moduleForComponent, test, skip } from 'ember-qunit'; 2 | import wait from 'ember-test-helpers/wait'; 3 | import hbs from 'htmlbars-inline-precompile'; 4 | import RSVP from 'rsvp'; 5 | import { run } from '@ember/runloop'; 6 | 7 | moduleForComponent('pretty-color', 'Integration | Component | deferred content', { 8 | integration: true 9 | }); 10 | 11 | test('shows rejected component when rejected, hide when pending or resolved', function(assert) { 12 | assert.expect(10); 13 | 14 | let deferred = RSVP.defer(); 15 | 16 | this.set('promise', deferred.promise); 17 | 18 | this.render(hbs` 19 | {{#deferred-content promise as |d|}} 20 | {{#d.rejected as |reason|}}
Rejected: {{reason}}
{{/d.rejected}} 21 | {{#if d.isRejected}}
Rejected: {{d.content}}
{{/if}} 22 | {{/deferred-content}} 23 | `); 24 | 25 | assert.equal(this.$('#rejected').length, 0, 'hides the rejected component'); 26 | assert.equal(this.$('#rejected-flag').length, 0, 'hides the rejected if block'); 27 | 28 | deferred.reject('failed'); 29 | 30 | return wait() 31 | .then(() => { 32 | let rejectedDiv = this.$('#rejected'); 33 | assert.equal(rejectedDiv.length, 1, 'shows the rejected component when rejected'); 34 | assert.equal(rejectedDiv.text().trim(), 'Rejected: failed', 'yields the rejected value to the component'); 35 | let rejectedBlock = this.$('#rejected-flag'); 36 | assert.equal(rejectedBlock.length, 1, 'shows the rejected if block when rejected'); 37 | assert.equal(rejectedBlock.text().trim(), 'Rejected: failed', 'makes reject value available at d.content the rejected value to the component'); 38 | }) 39 | .then(() => { 40 | deferred = RSVP.defer(); 41 | this.set('promise', deferred.promise); 42 | return wait(); 43 | }) 44 | .then(() => { 45 | assert.equal(this.$('#rejected').length, 0, 'hides the rejected component'); 46 | assert.equal(this.$('#rejected-flag').length, 0, 'hides the rejected if block'); 47 | deferred.resolve(); 48 | return wait(); 49 | }) 50 | .then(() => { 51 | assert.equal(this.$('#rejected').length, 0, 'hides the rejected component when fulfilled'); 52 | assert.equal(this.$('#rejected-flag').length, 0, 'hides the rejected if block when fufilled'); 53 | }); 54 | }); 55 | 56 | test('shows fulfilled component when fulfilled, hide when pending or rejected', function(assert) { 57 | assert.expect(10); 58 | 59 | let deferred = RSVP.defer(); 60 | 61 | this.set('promise', deferred.promise); 62 | 63 | this.render(hbs` 64 | {{#deferred-content promise as |d|}} 65 | {{#d.fulfilled as |content|}}
Fulfilled: {{content}}
{{/d.fulfilled}} 66 | {{#if d.isFulfilled}}
Fulfilled: {{d.content}}
{{/if}} 67 | {{/deferred-content}} 68 | `); 69 | 70 | assert.equal(this.$('#fulfilled').length, 0, 'hides the fulfilled component'); 71 | assert.equal(this.$('#fulfilled-flag').length, 0, 'hides the fulfilled if block'); 72 | 73 | deferred.resolve('hello world'); 74 | 75 | return wait() 76 | .then(() => { 77 | let fulfilledDiv = this.$('#fulfilled'); 78 | assert.equal(fulfilledDiv.length, 1, 'shows the fulfilled component when fulfilled'); 79 | assert.equal(fulfilledDiv.text().trim(), 'Fulfilled: hello world', 'yields the fulfilled value to the component'); 80 | let fulfilledBlock = this.$('#fulfilled-flag'); 81 | assert.equal(fulfilledBlock.length, 1, 'shows the fulfilled if block when fulfilled'); 82 | assert.equal(fulfilledBlock.text().trim(), 'Fulfilled: hello world', 'makes the resolve value availbe via d.content'); 83 | }) 84 | .then(() => { 85 | deferred = RSVP.defer(); 86 | this.set('promise', deferred.promise); 87 | return wait(); 88 | }) 89 | .then(() => { 90 | assert.equal(this.$('#fulfilled').length, 0, 'hides the fulfilled component'); 91 | assert.equal(this.$('#fulfilled-flag').length, 0, 'hides the fulfilled if block'); 92 | deferred.reject(); 93 | return wait(); 94 | }) 95 | .then(() => { 96 | assert.equal(this.$('#fulfilled').length, 0, 'hides the fulfilled component when rejected'); 97 | assert.equal(this.$('#fulfilled-flag').length, 0, 'hides the fulfilled if block when rejected'); 98 | }); 99 | }); 100 | 101 | test('shows pending component when unresolved, hide when fulfilled or rejected', function(assert) { 102 | assert.expect(8); 103 | 104 | let deferred = RSVP.defer(); 105 | 106 | this.set('promise', deferred.promise); 107 | 108 | this.render(hbs` 109 | {{#deferred-content promise as |d|}} 110 | {{#d.pending}}
Pending
{{/d.pending}} 111 | {{#if d.isPending}}
Pending
{{/if}} 112 | {{/deferred-content}} 113 | `); 114 | 115 | assert.equal(this.$('#pending').length, 1, 'display the pending component'); 116 | assert.equal(this.$('#pending-flag').length, 1, 'display the pending if block'); 117 | 118 | deferred.resolve(); 119 | 120 | return wait() 121 | .then(() => { 122 | assert.equal(this.$('#pending').length, 0, 'hide the pending component when resolving'); 123 | assert.equal(this.$('#pending-flag').length, 0, 'hide the pending if block when resolving'); 124 | }) 125 | .then(() => { 126 | deferred = RSVP.defer(); 127 | this.set('promise', deferred.promise); 128 | return wait(); 129 | }) 130 | .then(() => { 131 | assert.equal(this.$('#pending').length, 1, 'display the pending component'); 132 | assert.equal(this.$('#pending-flag').length, 1, 'display the pending if block'); 133 | deferred.reject(); 134 | return wait(); 135 | }) 136 | .then(() => { 137 | assert.equal(this.$('#pending').length, 0, 'hide the pending component when rejecting'); 138 | assert.equal(this.$('#pending-flag').length, 0, 'hide the pending if block when rejecting'); 139 | }); 140 | }); 141 | 142 | test('shows settled component when settled, hide when unresolved', function(assert) { 143 | assert.expect(8); 144 | 145 | let deferred = RSVP.defer(); 146 | 147 | this.set('promise', deferred.promise); 148 | 149 | this.render(hbs` 150 | {{#deferred-content promise as |d|}} 151 | {{#d.settled}}
Settled
{{/d.settled}} 152 | {{#if d.isSettled}}
Settled
{{/if}} 153 | {{/deferred-content}} 154 | `); 155 | 156 | assert.equal(this.$('#settled').length, 0, 'hide the settled component when pending'); 157 | assert.equal(this.$('#settled-flag').length, 0, 'hide the settled if block when pending'); 158 | 159 | deferred.resolve(); 160 | 161 | return wait() 162 | .then(() => { 163 | assert.equal(this.$('#settled').length, 1, 'display the settled component when resolved'); 164 | assert.equal(this.$('#settled-flag').length, 1, 'display the settled if block when resolved'); 165 | }) 166 | .then(() => { 167 | deferred = RSVP.defer(); 168 | this.set('promise', deferred.promise); 169 | return wait(); 170 | }) 171 | .then(() => { 172 | assert.equal(this.$('#settled').length, 0, 'hide the settled component when pending'); 173 | assert.equal(this.$('#settled-flag').length, 0, 'hide the settled if block when pending'); 174 | deferred.reject(); 175 | return wait(); 176 | }) 177 | .then(() => { 178 | assert.equal(this.$('#settled').length, 1, 'display the settled component when rejected'); 179 | assert.equal(this.$('#settled-flag').length, 1, 'display the settled if block when rejected'); 180 | }); 181 | }); 182 | 183 | test('accounts for being torn down - rejected', function(assert) { 184 | assert.expect(0); 185 | let deferred = RSVP.defer(); 186 | 187 | this.set('promise', deferred.promise); 188 | this.set('show', true); 189 | 190 | this.render(hbs` 191 | {{#if show}} 192 | {{#deferred-content promise as |d|}} 193 | {{#d.rejected}}{{/d.rejected}} 194 | {{/deferred-content}} 195 | {{/if}} 196 | `); 197 | 198 | this.set('show', false); 199 | deferred.reject(); 200 | return wait(); 201 | }); 202 | 203 | test('accounts for being torn down - fullfilled', function(assert) { 204 | assert.expect(0); 205 | let deferred = RSVP.defer(); 206 | 207 | this.set('promise', deferred.promise); 208 | this.set('show', true); 209 | 210 | this.render(hbs` 211 | {{#if show}} 212 | {{#deferred-content promise as |d|}} 213 | {{#d.fulfilled}}{{/d.fulfilled}} 214 | {{/deferred-content}} 215 | {{/if}} 216 | `); 217 | 218 | this.set('show', false); 219 | deferred.resolve(); 220 | return wait(); 221 | }); 222 | 223 | test('accounts for being torn down - pending', function(assert) { 224 | assert.expect(0); 225 | let deferred = RSVP.defer(); 226 | 227 | this.set('promise', deferred.promise); 228 | this.set('show', true); 229 | 230 | this.render(hbs` 231 | {{#if show}} 232 | {{#deferred-content promise as |d|}} 233 | {{#d.pending}}{{/d.pending}} 234 | {{/deferred-content}} 235 | {{/if}} 236 | `); 237 | 238 | this.set('show', false); 239 | deferred.resolve(); 240 | return wait(); 241 | }); 242 | 243 | test('accounts for being torn down - settled', function(assert) { 244 | assert.expect(0); 245 | let deferred = RSVP.defer(); 246 | 247 | this.set('promise', deferred.promise); 248 | this.set('show', true); 249 | 250 | this.render(hbs` 251 | {{#if show}} 252 | {{#deferred-content promise as |d|}} 253 | {{#d.settled}}{{/d.settled}} 254 | {{/deferred-content}} 255 | {{/if}} 256 | `); 257 | 258 | this.set('show', false); 259 | deferred.resolve(); 260 | return wait(); 261 | }); 262 | 263 | skip('raises assertion when passed argument that is not promise', function(assert) { 264 | assert.expect(1); 265 | this.set('promise', { data: 'I\'m a POJO!' }); 266 | 267 | try { 268 | run(() => { 269 | this.render(hbs`{{deferred-content promise}}`); 270 | }); 271 | } catch (e) { 272 | let errorMessageRegex = /You must pass a promise to ember-deferred-content/i; 273 | assert.ok( 274 | errorMessageRegex.test(e.message), 275 | 'Raises assertion when argument provided to component is not a promise' 276 | ); 277 | } 278 | }); 279 | 280 | test('should not render empty wrapper DOM nodes', function (assert) { 281 | assert.expect(1); 282 | 283 | let deferred = RSVP.defer(); 284 | 285 | this.set('promise', deferred.promise); 286 | 287 | this.render(hbs`{{#deferred-content promise as |d|}} 288 | {{#d.settled}} 289 | {{/d.settled}} 290 | {{#d.pending}} 291 | {{/d.pending}} 292 | {{#d.fulfilled}} 293 | {{/d.fulfilled}} 294 | {{#d.rejected}} 295 | {{/d.rejected}} 296 | {{/deferred-content}}`); 297 | 298 | deferred.resolve(); 299 | 300 | return wait() 301 | .then(() => { 302 | assert.equal(this.$().children().length, 0); 303 | }); 304 | }); 305 | 306 | --------------------------------------------------------------------------------