1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
import Wikis from '~/pages/shared/wikis/wikis';
import { setHTMLFixture } from './helpers/fixtures';
describe('Wikis', () => {
describe('setting the commit message when the title changes', () => {
const editFormHtmlFixture = args => `<form class="wiki-form ${
args.newPage ? 'js-new-wiki-page' : ''
}">
<input type="text" id="wiki_title" value="My title" />
<input type="text" id="wiki_message" />
<select class="form-control select-control" name="wiki[format]" id="wiki_format">
<option value="markdown">Markdown</option>
<option selected="selected" value="rdoc">RDoc</option>
<option value="asciidoc">AsciiDoc</option>
<option value="org">Org</option>
</select>
<textarea id="wiki_content"></textarea>
<code class="js-markup-link-example">{Link title}[link:page-slug]</code>
</form>
`;
let wikis;
let titleInput;
let messageInput;
let changeFormatSelect;
let linkExample;
const findBeforeUnloadWarning = () => window.onbeforeunload?.();
const findContent = () => document.getElementById('wiki_content');
const findForm = () => document.querySelector('.wiki-form');
describe('when the wiki page is being created', () => {
const formHtmlFixture = editFormHtmlFixture({ newPage: true });
beforeEach(() => {
setHTMLFixture(formHtmlFixture);
titleInput = document.getElementById('wiki_title');
messageInput = document.getElementById('wiki_message');
changeFormatSelect = document.querySelector('#wiki_format');
linkExample = document.querySelector('.js-markup-link-example');
wikis = new Wikis();
});
it('binds an event listener to the title input', () => {
wikis.handleWikiTitleChange = jest.fn();
titleInput.dispatchEvent(new Event('keyup'));
expect(wikis.handleWikiTitleChange).toHaveBeenCalled();
});
it('sets the commit message when title changes', () => {
titleInput.value = 'My title';
messageInput.value = '';
titleInput.dispatchEvent(new Event('keyup'));
expect(messageInput.value).toEqual('Create My title');
});
it('replaces hyphens with spaces', () => {
titleInput.value = 'my-hyphenated-title';
titleInput.dispatchEvent(new Event('keyup'));
expect(messageInput.value).toEqual('Create my hyphenated title');
});
});
describe('when the wiki page is being updated', () => {
const formHtmlFixture = editFormHtmlFixture({ newPage: false });
beforeEach(() => {
setHTMLFixture(formHtmlFixture);
titleInput = document.getElementById('wiki_title');
messageInput = document.getElementById('wiki_message');
wikis = new Wikis();
});
it('sets the commit message when title changes, prefixing with "Update"', () => {
titleInput.value = 'My title';
messageInput.value = '';
titleInput.dispatchEvent(new Event('keyup'));
expect(messageInput.value).toEqual('Update My title');
});
it.each`
value | text
${'markdown'} | ${'[Link Title](page-slug)'}
${'rdoc'} | ${'{Link title}[link:page-slug]'}
${'asciidoc'} | ${'link:page-slug[Link title]'}
${'org'} | ${'[[page-slug]]'}
`('updates a message when value=$value is selected', ({ value, text }) => {
changeFormatSelect.value = value;
changeFormatSelect.dispatchEvent(new Event('change'));
expect(linkExample.innerHTML).toBe(text);
});
it('starts with no unload warning', () => {
expect(findBeforeUnloadWarning()).toBeUndefined();
});
describe('when wiki content is updated', () => {
beforeEach(() => {
const content = findContent();
content.value = 'Lorem ipsum dolar sit!';
content.dispatchEvent(new Event('input'));
});
it('sets before unload warning', () => {
expect(findBeforeUnloadWarning()).toBe('');
});
it('when form submitted, unsets before unload warning', () => {
findForm().dispatchEvent(new Event('submit'));
expect(findBeforeUnloadWarning()).toBeUndefined();
});
});
});
});
});
|
