docbrown/app/javascript/article-form/__tests__/articleForm.test.jsx
Ali Spittel 704b7bce9c Feature/autosave editor (#1633)
* Add myself to core contributors

* add myself to the core contributors

* implement autosave in sessionStorage

* clear sessionstorage on save

* add new changes flag

* add clear  button and css for it

* add clear button functionality

* make clear session storage only run if save is successful

* update jest snapshot for autosave

* add a few tests

* add a few tests

* add test for clear button

* make autosave work for title, tags, and cover image

* remove console.log

* make clear button into a message instead

* move to button with no styling instead of span

* remove warning on refresh

* remove warning on refresh

* move to localstorage so that persists across tabs

* fix blip on change from HTML to JSX

* make confirm work properly

* fix css jump for v2 editor

* fix v2 editor height jump

* remove unused onKeyUp prop

* indent _v2_form.html.erb file

* indent v2 editor erb

* Update package.json with missing package
2019-02-28 07:00:58 -08:00

72 lines
2 KiB
JavaScript

import { h, render as preactRender } from 'preact';
import render from 'preact-render-to-json';
import { shallow, deep } from 'preact-render-spy';
import { JSDOM } from 'jsdom';
import ArticleForm from '../articleForm';
import algoliasearch from '../elements/__mocks__/algoliasearch';
describe('<ArticleForm />', () => {
beforeEach(() => {
const doc = new JSDOM('<!doctype html><html><body></body></html>');
global.document = doc;
global.window = doc.defaultView;
global.document.body.createTextRange = function() {
return {
setEnd() {},
setStart() {},
getBoundingClientRect() {
return { right: 0 };
},
getClientRects() {
return {
length: 0,
left: 0,
right: 0,
};
},
};
};
global.window.initEditorResize = jest.fn();
global.document.body.innerHTML = "<div id='editor-help-guide'></div>";
global.window.algoliasearch = algoliasearch;
localStorage.clear();
localStorage.__STORE__ = {};
});
it('renders properly', () => {
const tree = render(getArticleForm());
expect(tree).toMatchSnapshot();
});
it('initally loads blank', () => {
const form = shallow(getArticleForm());
expect(form.state().bodyMarkdown).toBe('');
});
it('loads text from sessionstorage when available', () => {
localStorage.setItem(
'http://localhost/',
JSON.stringify({ bodyMarkdown: 'hello, world' }),
);
const form = shallow(getArticleForm());
expect(form.state().bodyMarkdown).toBe('hello, world');
});
it('resets the post on reset press', () => {
const form = shallow(getArticleForm());
form.find('.clear').simulate('click');
expect(form.state().bodyMarkdown).toBe('');
});
});
const getArticleForm = () => (
<ArticleForm
article={
'{ "id": null, "body_markdown": null, "cached_tag_list": null, "main_image": null, "published": false, "title": null }'
}
/>
);