Ghost/ghost/admin/tests/integration/components/gh-cm-editor-test.js
Kevin Ansfield ea9c8c03fe
Update dependency ember-template-lint to v5.3.0 (#16062)
refs https://github.com/TryGhost/Ghost/pull/15550

Pulled out of the rolled up node+ember-js+ember-template rollup linter update PR as it required fairly extensive changes.

- bumped package
- renamed `no-down-event-binding` to `no-pointer-down-event-binding`
- disabled `no-pointer-down-event-binding` rule
- disabled `no-triple-curlies` rule
- ran `yarn lint:hbs --fix`
- updated integration tests to match Octane syntax
- fixed various one-off errors
- updated .lint-todo
2023-01-04 09:39:32 +00:00

51 lines
2.0 KiB
JavaScript

import hbs from 'htmlbars-inline-precompile';
import {describe, it} from 'mocha';
import {expect} from 'chai';
import {find, render, settled} from '@ember/test-helpers';
import {setupRenderingTest} from 'ember-mocha';
// NOTE: If the browser window is not focused/visible CodeMirror (or Chrome?) will
// take longer to respond to/fire events so it's possible that some of these tests
// will take 1-3 seconds
describe('Integration: Component: gh-cm-editor', function () {
setupRenderingTest();
it('handles change event', async function () {
this.set('onUpdate', (value) => {
this.set('text', value);
});
this.set('text', '');
await render(hbs`<GhCmEditor @value={{this.text}} @classNames="gh-input" @update={{this.onUpdate}} />`);
// access CodeMirror directly as it doesn't pick up changes to the textarea
let cm = find('.gh-input .CodeMirror').CodeMirror;
cm.setValue('Testing');
await settled();
expect(this.text, 'text value after CM editor change')
.to.equal('Testing');
});
it('can autofocus', async function () {
// CodeMirror's events are triggered outside of anything we can watch for
// in the tests so let's run the class check when we know the event has
// been fired and timeout if it's not fired as we expect
let onFocus = async () => {
// wait for runloop to finish so that the new class has been rendered
await settled();
expect(find('.gh-input').classList.contains('focus'), 'has focused class on first render with autofocus')
.to.be.true;
};
this.set('onUpdate', (value) => {
this.set('text', value);
});
this.set('onFocus', onFocus);
this.set('text', '');
await render(hbs`<GhCmEditor @value={{this.text}} @classNames="gh-input" @update={{this.onUpdate}} @autofocus={{true}} @focus-in={{this.onFocus}} />`);
});
});