Skip to content

Instantly share code, notes, and snippets.

@sukima
Last active February 24, 2021 18:56
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sukima/bf09edc4f54f8f068ca0573edaa9cf7b to your computer and use it in GitHub Desktop.
Save sukima/bf09edc4f54f8f068ca0573edaa9cf7b to your computer and use it in GitHub Desktop.
How to trap known errors
import Component from '@glimmer/component';
import { action } from '@ember/object';
import { tracked } from '@glimmer/tracking';
function handleError(error) {
if (!error.isExpected) {
throw error;
}
}
export default class extends Component {
@tracked state = 'idle';
@action
async doSomething() {
this.state = 'loading';
try {
await this.args.callback();
this.state = 'done';
} catch (error) {
this.state = 'errored';
handleError(error);
}
}
}
<button type="button" ...attributes {{on "click" this.doSomething}}>{{this.state}}</button>
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render, find, click } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
class TestError extends Error {
message = 'test error';
isExpected = true;
}
module('TODO: put something here', function(hooks) {
setupRenderingTest(hooks);
test('it manages an errored state', async function(assert) {
let callCount = 0;
this.callbackStub = () => {
callCount++;
return Promise.reject(new TestError());
};
await render(hbs`<MyComponent id="test-component" @callback={{this.callbackStub}} />`);
await click('#test-component');
assert.equal(find('#test-component').textContent.trim(), 'errored');
assert.equal(callCount, 1);
});
});
import Application from '../app';
import config from '../config/environment';
import { setApplication } from '@ember/test-helpers';
import { assign } from '@ember/polyfills';
import { start } from 'ember-qunit';
let attributes = {
rootElement: '#test-root',
autoboot: false
};
attributes = assign(attributes, config.APP);
let application = Application.create(attributes);
setApplication(application);
start();
{
"version": "0.17.1",
"EmberENV": {
"FEATURES": {},
"_TEMPLATE_ONLY_GLIMMER_COMPONENTS": false,
"_APPLICATION_TEMPLATE_WRAPPER": true,
"_JQUERY_INTEGRATION": true
},
"options": {
"use_pods": false,
"enable-testing": true
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js",
"ember": "3.18.1",
"ember-template-compiler": "3.18.1",
"ember-testing": "3.18.1"
},
"addons": {
"@glimmer/component": "1.0.0"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment