Skip to content

Commit d4ca58c

Browse files
pollett21pollett21
committed
Merge branch 'master' of github.com:creativecommons/cc-chooser into 38-write-tests-for-license-description-component
2 parents ec9e47a + 51b47e2 commit d4ca58c

File tree

3 files changed

+285
-24
lines changed

3 files changed

+285
-24
lines changed

‎src/components/HTMLGenerator.vue

-24
Original file line numberDiff line numberDiff line change
@@ -95,28 +95,6 @@
9595
</b-field>
9696
<p class='help'>The URL to which the work should be attributed.</p>
9797
</div>
98-
<div class='column'>
99-
<b-field label='Source Work URL'>
100-
<b-input
101-
v-model='sourceWorkURL'
102-
placeholder='sourceWorkURL'
103-
></b-input>
104-
</b-field>
105-
<p class='help'>The URL of the work upon which this work is based or derived.</p>
106-
</div>
107-
</div>
108-
</div>
109-
<div class='metadata-input-row'>
110-
<div class='columns'>
111-
<div class='column'>
112-
<b-field label='More Permissions URL'>
113-
<b-input
114-
v-model='morePermsURL'
115-
placeholder='morePermsURL'
116-
></b-input>
117-
</b-field>
118-
<p class='help'>A URL where a user can find information about obtaining rights that are not already permitted by the CC license.</p>
119-
</div>
12098
<div class='column'>
12199
<b-field label='Attribute Work to Name'>
122100
<b-input
@@ -153,8 +131,6 @@ export default {
153131
workTitle: '',
154132
attributeToName: '',
155133
attributeToURL: '',
156-
sourceWorkURL: '',
157-
morePermsURL: '',
158134
workLocation: ''
159135
}
160136
},

‎test/unit/specs/components/HTMLGenerator.spec.js

+79
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import HTMLGenerator from '@/components/HTMLGenerator'
2+
import { shallowMount, createLocalVue } from '@vue/test-utils'
3+
import Buefy from 'buefy'
4+
5+
const defaultHtml = '<p style="font-size: 0.9rem;font-style: italic;"><a href="">"This work"</a>' +
6+
' is licensed under <a href="https://creativecommons.org/licenses/by/4.0/?ref=ccchooser" ' +
7+
'style="margin-right: 5px;">CC BY 4.0</a><a href="https://creativecommons.org/licenses/by/4.0/?ref=ccchooser" ' +
8+
'target="_blank" rel="noopener noreferrer" style="display: inline-block;white-space: none;opacity: .7;' +
9+
'margin-top: 2px;margin-left: 3px;height: 22px !important;"><img style="height: inherit;margin-right: 3px;' +
10+
'display: inline-block;" src="https://search.creativecommons.org/static/img/cc_icon.svg" />' +
11+
'<img style="height: inherit;margin-right: 3px;display: inline-block;" ' +
12+
'src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a></p>'
13+
const shortLicenseName = 'CC BY 4.0'
14+
const defaultLicenseURL = 'https://creativecommons.org/licenses/by/4.0/?ref=ccchooser'
15+
16+
const newObject = {
17+
workTitle: 'newWorkTitle',
18+
attributeToName: 'newAttributeToName',
19+
attributeToURL: 'https://new_attribute_to_url.com',
20+
workLocation: 'https://new_work_location.com'
21+
}
22+
23+
const localVue = createLocalVue()
24+
localVue.use(Buefy)
25+
26+
describe('HTMLGenerator.vue', () => {
27+
const wrapper = shallowMount(HTMLGenerator, {
28+
localVue,
29+
propsData: {
30+
shortLicenseName
31+
}
32+
})
33+
34+
it('renders the correct markup', () => {
35+
expect(wrapper.element).toMatchSnapshot()
36+
expect(wrapper.html()).toContain('<textarea id="attribution-html" readonly="readonly" class="textarea">')
37+
expect(wrapper.html().includes('textarea'))
38+
})
39+
40+
it('renders correctly with default values', () => {
41+
expect(wrapper.vm.attributionHTML()).toEqual(defaultHtml)
42+
expect(wrapper.html().includes(shortLicenseName))
43+
expect(wrapper.vm.licenseURL).toEqual(defaultLicenseURL)
44+
expect(wrapper.vm.workTitle).toEqual('')
45+
expect(wrapper.vm.workLocation).toEqual('')
46+
expect(wrapper.vm.iconsArr).toEqual(['by'])
47+
})
48+
49+
it('changes rich text correctly when workLocation changes', () => {
50+
wrapper.setData({'workLocation': newObject.workLocation})
51+
expect(wrapper.find('#attribution-richtext').html()).toContain(newObject.workLocation)
52+
})
53+
54+
it('changes html correctly when title changes', () => {
55+
wrapper.setData({'workTitle': newObject.workTitle})
56+
expect(wrapper.vm.workTitle).toEqual(newObject.workTitle)
57+
expect(wrapper.vm.attributionHTML()).toContain(newObject.workTitle)
58+
})
59+
60+
it('changes html correctly when attribute url and name fields change', () => {
61+
const byName = `<span> by <span>${newObject.attributeToName}</span></span>`
62+
const byNameAndURL = `<span> by <a href="${newObject.attributeToURL}">${newObject.attributeToName}</a></span>`
63+
wrapper.setData({'attributeToName': newObject.attributeToName})
64+
expect(wrapper.vm.attributionHTML()).toContain(byName)
65+
wrapper.setData({'attributeToURL': newObject.attributeToURL})
66+
expect(wrapper.vm.attributionHTML()).toContain(byNameAndURL)
67+
})
68+
69+
it('changes correctly when license type changes', () => {
70+
const ncnd = 'CC BY-NC-ND 4.0'
71+
const ncndURL = 'https://creativecommons.org/licenses/by-nc-nd/4.0/?ref=ccchooser'
72+
const ncndIconsArr = ['by', 'nc', 'nd']
73+
wrapper.setProps({'shortLicenseName': ncnd})
74+
expect(wrapper.vm.attributionHTML()).toContain(ncndURL)
75+
expect(wrapper.html()).toContain(ncnd)
76+
expect(wrapper.vm.licenseURL).toEqual(ncndURL)
77+
expect(wrapper.vm.iconsArr).toEqual(ncndIconsArr)
78+
})
79+
})

‎test/unit/specs/components/__snapshots__/HTMLGenerator.spec.js.snap

+206
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,206 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`HTMLGenerator.vue renders the correct markup 1`] = `
4+
<div>
5+
<h3
6+
class="title is-3"
7+
>
8+
Embed your License Attribution!
9+
</h3>
10+
11+
<span
12+
id="attribution-richtext-container"
13+
>
14+
<span
15+
class="photo_usage-attribution"
16+
id="attribution-richtext"
17+
>
18+
<!---->
19+
20+
<!---->
21+
22+
<p>
23+
This work
24+
</p>
25+
26+
<!---->
27+
28+
<!---->
29+
30+
is licensed under
31+
32+
<a
33+
class="photo_license"
34+
href="https://creativecommons.org/licenses/by/4.0/?ref=ccchooser"
35+
rel="noopener"
36+
target="_blank"
37+
>
38+
39+
CC BY 4.0
40+
41+
</a>
42+
</span>
43+
44+
<licenseicons-stub
45+
iconsarr="by"
46+
url="https://creativecommons.org/licenses/by/4.0/?ref=ccchooser"
47+
/>
48+
</span>
49+
50+
<copybutton-stub
51+
el="#attribution-richtext"
52+
id="copy-richtext-btn"
53+
title="Copy the attribution to paste into your blog or document"
54+
>
55+
56+
Copy Rich Text
57+
58+
</copybutton-stub>
59+
60+
<div
61+
class="control"
62+
id="generated-html-container"
63+
>
64+
<textarea
65+
class="textarea"
66+
id="attribution-html"
67+
readonly="readonly"
68+
/>
69+
</div>
70+
71+
<copybutton-stub
72+
el="#attribution-html"
73+
id="copy-html-btn"
74+
title="Copy the attribution to paste into your blog or document"
75+
>
76+
77+
Copy HTML
78+
79+
</copybutton-stub>
80+
81+
<div
82+
id="generator-meta-inputs"
83+
>
84+
<b
85+
id="generator-meta-inputs-heading"
86+
>
87+
88+
Filling out the boxes below is optional, but it adds more data
89+
to the generated HTML and rich text above!
90+
91+
</b>
92+
93+
<div
94+
class="metadata-input-row"
95+
>
96+
<div
97+
class="columns"
98+
>
99+
<div
100+
class="column"
101+
>
102+
<b-field-stub
103+
addons="true"
104+
label="Title of Work"
105+
>
106+
<b-input-stub
107+
customclass=""
108+
hascounter="true"
109+
placeholder="workTitle"
110+
type="text"
111+
usehtml5validation="true"
112+
value=""
113+
/>
114+
</b-field-stub>
115+
116+
<p
117+
class="help"
118+
>
119+
The title of the work being licensed.
120+
</p>
121+
</div>
122+
123+
<div
124+
class="column"
125+
>
126+
<b-field-stub
127+
addons="true"
128+
label="Work Location"
129+
>
130+
<b-input-stub
131+
customclass=""
132+
hascounter="true"
133+
placeholder="workLocation"
134+
type="text"
135+
usehtml5validation="true"
136+
value=""
137+
/>
138+
</b-field-stub>
139+
140+
<p
141+
class="help"
142+
>
143+
The URL where the work will be hosted or located.
144+
</p>
145+
</div>
146+
</div>
147+
</div>
148+
149+
<div
150+
class="metadata-input-row"
151+
>
152+
<div
153+
class="columns"
154+
>
155+
<div
156+
class="column"
157+
>
158+
<b-field-stub
159+
addons="true"
160+
label="Attribute Work to URL"
161+
>
162+
<b-input-stub
163+
customclass=""
164+
hascounter="true"
165+
placeholder="attributeToURL"
166+
type="text"
167+
usehtml5validation="true"
168+
value=""
169+
/>
170+
</b-field-stub>
171+
172+
<p
173+
class="help"
174+
>
175+
The URL to which the work should be attributed.
176+
</p>
177+
</div>
178+
179+
<div
180+
class="column"
181+
>
182+
<b-field-stub
183+
addons="true"
184+
label="Attribute Work to Name"
185+
>
186+
<b-input-stub
187+
customclass=""
188+
hascounter="true"
189+
placeholder="attributeToName"
190+
type="text"
191+
usehtml5validation="true"
192+
value=""
193+
/>
194+
</b-field-stub>
195+
196+
<p
197+
class="help"
198+
>
199+
The name of the person who should receive attribution for the work.
200+
</p>
201+
</div>
202+
</div>
203+
</div>
204+
</div>
205+
</div>
206+
`;

0 commit comments

Comments
 (0)