From d61ff90ca6c6ad2f977dd3e5b793e5f6ed24a94b Mon Sep 17 00:00:00 2001
From: Olga Bulat <obulat@gmail.com>
Date: Thu, 29 Oct 2020 14:22:49 -0700
Subject: [PATCH] Rewrite tests for license code generation (#195)

* Show absolute urls in the license code

* Improve tests for LicenseCode and license-uilities

* Update Store to make it testable

* Update license-utilities testing to really test generated code

* Simplify license-utilities tests

* Simplify license-utilities tests

* Simplify license-utilities tests

* Fix docs and remove -u flag for unit testing
---
 package-lock.json                             |  44 +-
 package.json                                  |   2 +-
 src/components/LicenseCode.vue                |  27 +-
 src/components/LicenseCopy.vue                |  12 +-
 src/main.js                                   |   3 +-
 src/store/index.js                            | 131 +--
 src/utils/license-utilities.js                | 184 +++-
 src/utils/licenses.js                         |  99 ++
 tests/e2e/specs/LicenseCode.js                |   6 +-
 .../unit/specs/components/LicenseCode.spec.js | 113 +--
 .../__snapshots__/LicenseCode.spec.js.snap    |  44 +-
 tests/unit/specs/utils/TestComponent.vue      |  34 +
 .../unit/specs/utils/license-uilities.test.js | 955 ------------------
 .../specs/utils/license-utilities.test.js     | 304 ++++++
 14 files changed, 769 insertions(+), 1189 deletions(-)
 create mode 100644 src/utils/licenses.js
 create mode 100644 tests/unit/specs/utils/TestComponent.vue
 delete mode 100644 tests/unit/specs/utils/license-uilities.test.js
 create mode 100644 tests/unit/specs/utils/license-utilities.test.js

diff --git a/package-lock.json b/package-lock.json
index f9229beb..24454358 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4425,16 +4425,16 @@
             }
         },
         "chromedriver": {
-            "version": "83.0.1",
-            "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-83.0.1.tgz",
-            "integrity": "sha512-51/YsLIMRF+L0ooMlM4aZjyoOpDs0gDXGlT6+/CwWEnvK53PUyef9FkotKbzknCaUeL/qUw3ic3IMmsNc+SUxg==",
+            "version": "86.0.0",
+            "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-86.0.0.tgz",
+            "integrity": "sha512-byLJWhAfuYOmzRYPDf4asJgGDbI4gJGHa+i8dnQZGuv+6WW1nW1Fg+8zbBMOfLvGn7sKL41kVdmCEVpQHn9oyg==",
             "dev": true,
             "requires": {
                 "@testim/chrome-version": "^1.0.7",
                 "axios": "^0.19.2",
                 "del": "^5.1.0",
-                "extract-zip": "^2.0.0",
-                "https-proxy-agent": "^2.2.4",
+                "extract-zip": "^2.0.1",
+                "https-proxy-agent": "^5.0.0",
                 "mkdirp": "^1.0.4",
                 "tcp-port-used": "^1.0.1"
             },
@@ -4445,6 +4445,15 @@
                     "integrity": "sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==",
                     "dev": true
                 },
+                "agent-base": {
+                    "version": "6.0.1",
+                    "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.1.tgz",
+                    "integrity": "sha512-01q25QQDwLSsyfhrKbn8yuur+JNw0H+0Y4JiGIKd3z9aYk/w/2kxD/Upc+t2ZBBSUNff50VjPsSW2YxM8QYKVg==",
+                    "dev": true,
+                    "requires": {
+                        "debug": "4"
+                    }
+                },
                 "array-union": {
                     "version": "2.1.0",
                     "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
@@ -4460,15 +4469,6 @@
                         "fill-range": "^7.0.1"
                     }
                 },
-                "debug": {
-                    "version": "3.2.6",
-                    "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
-                    "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
-                    "dev": true,
-                    "requires": {
-                        "ms": "^2.1.1"
-                    }
-                },
                 "del": {
                     "version": "5.1.0",
                     "resolved": "https://registry.npmjs.org/del/-/del-5.1.0.tgz",
@@ -4534,13 +4534,13 @@
                     }
                 },
                 "https-proxy-agent": {
-                    "version": "2.2.4",
-                    "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.4.tgz",
-                    "integrity": "sha512-OmvfoQ53WLjtA9HeYP9RNrWMJzzAz1JGaSFr1nijg0PVR1JaD/xbJq1mdEIIlxGpXp9eSe/O2LgU9DJmTPd0Eg==",
+                    "version": "5.0.0",
+                    "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz",
+                    "integrity": "sha512-EkYm5BcKUGiduxzSt3Eppko+PiNWNEpa4ySk9vTC6wDsQJW9rHSa+UhGNJoRYp7bz6Ht1eaRIa6QaJqO5rCFbA==",
                     "dev": true,
                     "requires": {
-                        "agent-base": "^4.3.0",
-                        "debug": "^3.1.0"
+                        "agent-base": "6",
+                        "debug": "4"
                     }
                 },
                 "ignore": {
@@ -7558,9 +7558,9 @@
             },
             "dependencies": {
                 "get-stream": {
-                    "version": "5.1.0",
-                    "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.1.0.tgz",
-                    "integrity": "sha512-EXr1FOzrzTfGeL0gQdeFEvOMm2mzMOglyiOXSTpPC+iAjAKftbr3jpCMWynogwYnM+eSj9sHGc6wjIcDvYiygw==",
+                    "version": "5.2.0",
+                    "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz",
+                    "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==",
                     "dev": true,
                     "requires": {
                         "pump": "^3.0.0"
diff --git a/package.json b/package.json
index d232f954..1fec718d 100644
--- a/package.json
+++ b/package.json
@@ -46,7 +46,7 @@
         "@vue/eslint-config-standard": "^5.1.2",
         "@vue/test-utils": "1.0.0-beta.29",
         "babel-eslint": "^10.1.0",
-        "chromedriver": "^83.0.1",
+        "chromedriver": "^86.0.0",
         "clipboardy": "^2.3.0",
         "eslint": "^6.8.0",
         "eslint-plugin-import": "^2.22.0",
diff --git a/src/components/LicenseCode.vue b/src/components/LicenseCode.vue
index afddf342..59a57ae3 100644
--- a/src/components/LicenseCode.vue
+++ b/src/components/LicenseCode.vue
@@ -13,14 +13,9 @@
                     v-if="workUrl && isWeb"
                     :href="workUrl"
                     rel="cc:attributionURL"
+                    :property="workTitle ? 'dct:title' : false"
                 >
-                    <span v-if="!workTitle">{{ $t('license-use.richtext.workTitle') }}</span>
-                    <span
-                        v-else
-                        property="dct:title"
-                    >
-                        {{ workTitle }}
-                    </span>
+                    {{ workTitle }}
                 </a>
                 <span
                     v-else-if="workTitle"
@@ -32,11 +27,11 @@
             </template>
             <template v-slot:creator>
                 <a
-                    v-if="creatorProfileUrl && isWeb"
+                    v-if="creatorName && creatorProfileUrl && isWeb"
                     :href="creatorProfileUrl"
                     rel="cc:attributionURL"
-                >
-                    <span v-html="creatorSpan" /></a>
+                    v-html="creatorSpan"
+                />
                 <span
                     v-else-if="creatorName"
                     v-html="creatorSpan"
@@ -107,13 +102,23 @@ export default {
             return this.attributionDetails.creatorName
         },
         creatorProfileUrl() {
+            const { creatorProfileUrl } = this.attributionDetails
+            if (creatorProfileUrl && !creatorProfileUrl.startsWith('http')) {
+                return `http://${creatorProfileUrl}`
+            }
             return this.attributionDetails.creatorProfileUrl
         },
         workTitle() {
             return this.attributionDetails.workTitle
+                ? this.attributionDetails.workTitle
+                : this.$t('license-use.richtext.workTitle')
         },
         workUrl() {
-            return this.attributionDetails.workUrl
+            const { workUrl } = this.attributionDetails
+            if (workUrl && !workUrl.startsWith('http')) {
+                return `http://${workUrl}`
+            }
+            return workUrl
         },
         isWeb() {
             return this.attributionType === 'web'
diff --git a/src/components/LicenseCopy.vue b/src/components/LicenseCopy.vue
index d1be26f5..0a74cb52 100644
--- a/src/components/LicenseCopy.vue
+++ b/src/components/LicenseCopy.vue
@@ -82,15 +82,15 @@ export default {
             return this.isWeb ? 'web' : 'print'
         },
         htmlLicenseParagraph() {
-            const data = generateHTML(this.attributionDetails, this.shortName)
+            const { work, creator, license, paragraph } = generateHTML(this.attributionDetails, this.shortName)
             const licenseCodeSpan = this.$i18n.t('license-use.richtext.full-text', {
-                workTitle: data.workTitle ? data.workTitle : this.$i18n.t('license-use.richtext.workTitle'),
-                creator: data.creator,
-                license: data.licenseLink,
-                by: data.creator ? this.$i18n.t('license-use.richtext.by') : '',
+                workTitle: work || this.$i18n.t('license-use.richtext.workTitle'),
+                creator,
+                license,
+                by: creator ? this.$i18n.t('license-use.richtext.by') : '',
                 'licensed-text': this.$i18n.t('license-use.richtext.licensed-text')
             })
-            return `${data.htmlString}${licenseCodeSpan}</p>`
+            return `${paragraph}${licenseCodeSpan}</p>`
         },
         activeTab: {
             get() { return this.currentTab },
diff --git a/src/main.js b/src/main.js
index dc86f28f..dd29cef6 100644
--- a/src/main.js
+++ b/src/main.js
@@ -2,7 +2,7 @@ import Vue from 'vue'
 import Buefy from 'buefy'
 import i18n from './i18n'
 import App from './App.vue'
-import store from './store'
+import createStore from './store'
 import './styles/vocab.scss'
 
 // Analytics
@@ -61,6 +61,7 @@ if (process.env.NODE_ENV === 'production') {
     })
 }
 
+const store = createStore({})
 new Vue({
     store,
     i18n,
diff --git a/src/store/index.js b/src/store/index.js
index f2986004..d89514ec 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -4,69 +4,76 @@ import { defaultAttributes, CC0Attributes, attrToShort, attrToFull, licenseUrl,
 
 Vue.use(Vuex)
 
-export default new Vuex.Store({
-    state: {
-        currentLicenseAttributes: { ...defaultAttributes },
-        attributionDetails: {
-            creatorName: '',
-            creatorProfileUrl: '',
-            workTitle: '',
-            workUrl: ''
-        }
-    },
-    getters: {
-        isLicenseSelected: state => {
-            /**
-             * By default, all four license attributes are undefined
-             * As soon as the first attribute(BY) is selected (true/false),
-             * we can show the recommended license
-             */
-            return state.currentLicenseAttributes.BY !== undefined
-        },
-        shortName: state => {
-            return attrToShort(state.currentLicenseAttributes)
-        },
-        fullName: state => {
-            return attrToFull(state.currentLicenseAttributes)
-        },
-        licenseUrl: state => (mode) => {
-            return licenseUrl(state.currentLicenseAttributes, mode)
-        },
-        iconsList: state => {
-            return licenseIconsArr(state.currentLicenseAttributes)
-        }
-    },
-    mutations: {
-        setSelected(state, { stepName, isSelected }) {
-            // When a Radio button is selected, currentLicenseAttribute 'selected' attribute is updated
-            if (['BY', 'NC', 'ND', 'SA'].indexOf(stepName) > -1) {
-                state.currentLicenseAttributes = {
-                    ...state.currentLicenseAttributes,
-                    [stepName]: isSelected
-                }
+const defaultState = {
+    currentLicenseAttributes: { ...defaultAttributes },
+    attributionDetails: {
+        creatorName: '',
+        creatorProfileUrl: '',
+        workTitle: '',
+        workUrl: ''
+    }
+}
+
+const createStore = (state) => {
+    const initialState = { ...defaultState, ...state }
+    return new Vuex.Store({
+        state: initialState,
+        getters: {
+            isLicenseSelected: state => {
+                /**
+                 * By default, all four license attributes are undefined
+                 * As soon as the first attribute(BY) is selected (true/false),
+                 * we can show the recommended license
+                 */
+                return state.currentLicenseAttributes.BY !== undefined
+            },
+            shortName: state => {
+                return attrToShort(state.currentLicenseAttributes)
+            },
+            fullName: state => {
+                return attrToFull(state.currentLicenseAttributes)
+            },
+            licenseUrl: state => (mode) => {
+                return licenseUrl(state.currentLicenseAttributes, mode)
+            },
+            iconsList: state => {
+                return licenseIconsArr(state.currentLicenseAttributes)
             }
         },
-        updateAttributesFromShort(state, shortName) {
-            if (shortName.includes('CC0')) {
-                state.currentLicenseAttributes = { ...CC0Attributes }
-            } else {
-                state.currentLicenseAttributes.BY = true
-                state.currentLicenseAttributes.NC = !!shortName.includes('NC')
-                state.currentLicenseAttributes.ND = !!shortName.includes('ND')
-                state.currentLicenseAttributes.SA = !!shortName.includes('SA')
+        mutations: {
+            setSelected(state, { stepName, isSelected }) {
+                // When a Radio button is selected, currentLicenseAttribute 'selected' attribute is updated
+                if (['BY', 'NC', 'ND', 'SA'].indexOf(stepName) > -1) {
+                    state.currentLicenseAttributes = {
+                        ...state.currentLicenseAttributes,
+                        [stepName]: isSelected
+                    }
+                }
+            },
+            updateAttributesFromShort(state, shortName) {
+                if (shortName.includes('CC0')) {
+                    state.currentLicenseAttributes = { ...CC0Attributes }
+                } else {
+                    state.currentLicenseAttributes.BY = true
+                    state.currentLicenseAttributes.NC = !!shortName.includes('NC')
+                    state.currentLicenseAttributes.ND = !!shortName.includes('ND')
+                    state.currentLicenseAttributes.SA = !!shortName.includes('SA')
+                }
+            },
+            setCreatorName(state, newName) {
+                state.attributionDetails.creatorName = newName
+            },
+            setCreatorProfileUrl(state, newName) {
+                state.attributionDetails.creatorProfileUrl = newName
+            },
+            setWorkTitle(state, newName) {
+                state.attributionDetails.workTitle = newName
+            },
+            setWorkUrl(state, newName) {
+                state.attributionDetails.workUrl = newName
             }
-        },
-        setCreatorName(state, newName) {
-            state.attributionDetails.creatorName = newName
-        },
-        setCreatorProfileUrl(state, newName) {
-            state.attributionDetails.creatorProfileUrl = newName
-        },
-        setWorkTitle(state, newName) {
-            state.attributionDetails.workTitle = newName
-        },
-        setWorkUrl(state, newName) {
-            state.attributionDetails.workUrl = newName
         }
-    }
-})
+    })
+}
+
+export default createStore
diff --git a/src/utils/license-utilities.js b/src/utils/license-utilities.js
index 197c2526..5159cdf3 100644
--- a/src/utils/license-utilities.js
+++ b/src/utils/license-utilities.js
@@ -1,18 +1,29 @@
-const CC0Attributes = { BY: false, NC: false, ND: false, SA: false }
-const CCBYAttributes = { BY: true, NC: false, ND: false, SA: false }
+/** @typedef {{BY?: boolean, NC?: boolean, ND?: boolean, SA?: boolean}} LicenseAttributes */
+
+/** @typedef {('CC0 1.0'|'CC BY 4.0'|'CC BY-NC 4.0'|'CC BY-NC-ND 4.0'|'CC BY-NC-SA 4.0'|'CC BY-ND 4.0'|'CC BY-ND-SA 4.0')} ShortLicenseName
+ */
+import { LICENSES } from './licenses'
+const CC0Attributes = LICENSES.CC0.ATTRIBUTES
+const CCBYAttributes = LICENSES.CC_BY.ATTRIBUTES
 const defaultAttributes = { BY: undefined, NC: undefined, ND: undefined, SA: undefined }
 
+/**
+ * Convert short license name to attributes
+ * @param {ShortLicenseName} shortLicenseName - name of the license with version number
+ * @returns {LicenseAttributes}}
+ */
 function shortToAttr(shortLicenseName) {
-    const short = shortLicenseName
-    if (short.includes('CC0')) {
-        return { ...CC0Attributes }
-    }
-    const nc = short.includes('NC')
-    const nd = short.includes('ND')
-    const sa = short.includes('SA')
-    return { ...CCBYAttributes, NC: nc, ND: nd, SA: sa }
+    const currentLicense = Object.values(LICENSES).find(license => {
+        return license.SHORT === shortLicenseName
+    })
+    return currentLicense ? currentLicense.ATTRIBUTES : currentLicense
 }
 
+/**
+ * Convert license attributes object to short license name
+ * @param {LicenseAttributes} attr
+ * @returns {ShortLicenseName}
+ */
 function attrToShort(attr) {
     if (attr.BY === undefined) return undefined
     if (!attr.BY) { return 'CC0 1.0' }
@@ -27,6 +38,11 @@ function attrToShort(attr) {
     return base
 }
 
+/**
+ * Convert license attributes object to full license name
+ * @param {{LicenseAttributes}} attr
+ * @returns {string|undefined}
+ */
 function attrToFull(attr) {
     if (attr.BY === undefined) { return undefined }
     if (!attr.BY) { return 'CC0 1.0 Universal' }
@@ -41,9 +57,13 @@ function attrToFull(attr) {
     return base
 }
 
+/**
+ * Returns url to license from short license name with version number (eg. 'CC BY 4.0')
+ * @param attr {LicenseAttributes} license attributes object
+ * @param [mode] {'web'| 'print'} (?ref=chooser-v1, target and rel are added to the end of the link if mode is web)
+ * @returns {string} url of the license information page
+ */
 function licenseUrl(attr, mode) {
-    // Returns url to license from short license name with version number (eg. 'CC BY 4.0')
-    // mode: web/ print (?ref=chooser-v1 is added to the end of the link if mode is web)
     const linkRef = mode === 'web' ? '/?ref=chooser-v1' : ''
     if (attr.BY === false) {
         return `https://creativecommons.org/publicdomain/zero/1.0${linkRef}`
@@ -53,15 +73,23 @@ function licenseUrl(attr, mode) {
     return `https://creativecommons.org/licenses/${short}/4.0${linkRef}`
 }
 
+/**
+ * Convert short license name to licence slug ('CC BY 4.0' -> 'cc-by')
+ * @param {ShortLicenseName} shortLicenseName
+ * @returns {string}
+ */
 function licenseSlug(shortLicenseName) {
-    // Returns lower case slugified string of license name without the version number
-    // 'CC BY 4.0' -> 'cc-by'
-    return shortLicenseName
-        .toLowerCase()
-        .replace(' ', '-')
-        .slice(0, shortLicenseName.length - 4)
+    const currentLicense = Object.values(LICENSES).find(license => {
+        return license.SHORT === shortLicenseName
+    })
+    return currentLicense ? currentLicense.SLUG : currentLicense
 }
 
+/**
+ * Convert license attributes object to an array of icon names
+ * @param {LicenseAttributes} licenseAttributes
+ * @returns {string[]|[]} Array with slugified names of icons, eg. ['cc', 'by']
+ */
 function licenseIconsArr(licenseAttributes) {
     if (!licenseAttributes.BY) {
         return ['zero']
@@ -76,8 +104,8 @@ function licenseIconsArr(licenseAttributes) {
 }
 
 function updateVisibleEnabledStatus(stepStatusData) {
-    let visible = []
-    let enabled = []
+    let visible
+    let enabled
     let stepsDisabledDue = ''
     if (stepStatusData.FS) {
         // User will select from the dropdown
@@ -114,53 +142,103 @@ function updateVisibleEnabledStatus(stepStatusData) {
     return { visible, enabled, stepsDisabledDue }
 }
 
-function generateHTML(attributionDetails, shortLicenseName) {
-    const dataForHtmlGeneration = {
-        htmlString: '',
-        creator: '',
-        workTitle: '',
-        licenseLink: ''
-    }
-    const { creatorName, creatorProfileUrl, workTitle, workUrl } = attributionDetails
-    dataForHtmlGeneration.htmlString =
-        '<p xmlns:dct="http://purl.org/dc/terms/"' +
-        ' xmlns:cc="http://creativecommons.org/ns#"' +
-        ' class="license-text">'
-    const iconStyle = 'style="height:22px!important;margin-left:3px;vertical-align:text-bottom;"'
-    const assetPathBase = 'https://mirrors.creativecommons.org/presskit/icons'
-    const assetPathRef = '?ref=chooser-v1'
-    let licenseIcons = `<img ${iconStyle} src="${assetPathBase}/cc.svg${assetPathRef}" />`
-    if (shortLicenseName.includes('CC0')) {
-        shortLicenseName = 'CC CC0 1.0'
-    }
-    licenseIcons += shortLicenseName
-        .slice(3, shortLicenseName.length - 4)
-        .split('-')
-        .map(attr => `<img ${iconStyle} src="${assetPathBase}/${attr.toLowerCase()}.svg${assetPathRef}" />`
-        ).join('')
-    const licenseHref = licenseUrl(shortToAttr(shortLicenseName))
-    dataForHtmlGeneration.licenseLink =
-        `<a rel="license" href="${licenseHref}">${shortLicenseName}${licenseIcons}</a>`
+const CC_NAMESPACE = {
+    NAME: 'xmlns:cc',
+    URI: 'http://creativecommons.org/ns#'
+}
+const DCT_NAMESPACE = {
+    NAME: 'xmlns:dct',
+    URI: 'http://purl.org/dc/terms/'
+}
+const ICON_STYLE = 'height:22px!important;margin-left:3px;vertical-align:text-bottom;'
+const ICON_BASE_URL = 'https://mirrors.creativecommons.org/presskit/icons/'
 
+/**
+ * Generate html for creator:
+ * 1. If the creator name is blank, even if creator link is provided, return a blank string
+ * 2. If only creator name is provided, return a span with proper metadata
+ * 3. If both creator name and URL are provided, returns an 'a' element with proper data and metadata
+ * @param {string} creatorName
+ * @param {string} creatorProfileUrl
+ * @returns {string}
+ */
+function generateCreatorCode(creatorName, creatorProfileUrl) {
+    let creator = ''
     if (creatorName) {
         if (creatorProfileUrl) {
-            dataForHtmlGeneration.creator =
-                `<a rel="cc:attributionURL dct:creator" property="cc:attributionName" href="${creatorProfileUrl}">${creatorName}</a>`
+            const absoluteUrl = creatorProfileUrl.startsWith('http') ? creatorProfileUrl : `http://${creatorProfileUrl}`
+            creator =
+                `<a rel="cc:attributionURL dct:creator" property="cc:attributionName" href="${absoluteUrl}">${creatorName}</a>`
         } else {
-            dataForHtmlGeneration.creator = `<span property="cc:attributionName">${creatorName}</span>`
+            creator = `<span property="cc:attributionName">${creatorName}</span>`
         }
     }
+    return creator
+}
+
+/**
+ * Generate html for work title:
+ * 1. If the work title is blank, event if work link is provided, return blank string
+ * 2. If only work title is provided, return a span with proper metadata
+ * 3. If both title and URL are provided, returns an 'a' element with proper data and metadata
+ * @param {string} workTitle
+ * @param {string} workUrl
+ * @returns {string}
+ */
+function generateWorkCode(workTitle, workUrl) {
+    let workCode = ''
     if (workTitle) {
         if (workUrl) {
-            dataForHtmlGeneration.workTitle = `<a rel="cc:attributionURL" property="dct:title" href="${workUrl}">${workTitle}</a>`
+            const absoluteUrl = workUrl.startsWith('http') ? workUrl : `http://${workUrl}`
+            workCode = `<a rel="cc:attributionURL" property="dct:title" href="${absoluteUrl}">${workTitle}</a>`
         } else {
-            dataForHtmlGeneration.workTitle = `<span property="dct:title">${workTitle}</span>`
+            workCode = `<span property="dct:title">${workTitle}</span>`
         }
     }
+    return workCode
+}
+
+/**
+ * Generates the html for the rich text license information, including license name,
+ * link to the license deed, and license icons
+ * @param {LicenseAttributes} licenseAttr
+ * @param {ShortLicenseName} shortLicenseName
+ * @returns {string} HTML code for the license
+ */
+function generateLicenseCode(licenseAttr, shortLicenseName) {
+    const iconStyle = `style="${ICON_STYLE}"`
+    const assetPathRef = '?ref=chooser-v1'
+    const licenseIconsCode = ['cc', ...licenseIconsArr(licenseAttr)]
+        .map(attr => `<img ${iconStyle} src="${ICON_BASE_URL}/${attr.toLowerCase()}.svg${assetPathRef}" />`
+        ).join('')
+
+    return (`<a rel="license" href="${licenseUrl(licenseAttr)}" target="_blank"
+        rel="license noopener noreferrer" style="display:inline-block;">
+        ${shortLicenseName}${licenseIconsCode}</a>`)
+}
+
+/**
+ * Generate data for use in attribution HTML through i18n
+ * @param attributionDetails
+ * @param {ShortLicenseName} shortLicenseName
+ * @returns {{creator: string, workTitle: string, licenseLink: string, htmlString: string}}
+ */
+function generateHTML(attributionDetails, shortLicenseName) {
+    const dataForHtmlGeneration = {}
+    const { creatorName, creatorProfileUrl, workTitle, workUrl } = attributionDetails
+    dataForHtmlGeneration.paragraph =
+        `<p ${DCT_NAMESPACE.NAME}="${DCT_NAMESPACE.URI}"` +
+        ` ${CC_NAMESPACE.NAME}="${CC_NAMESPACE.URI}"` +
+        ' class="license-text">'
+    const licenseAttr = shortToAttr(shortLicenseName)
+    dataForHtmlGeneration.license = generateLicenseCode(licenseAttr, shortLicenseName)
+    dataForHtmlGeneration.creator = generateCreatorCode(creatorName, creatorProfileUrl)
+    dataForHtmlGeneration.work = generateWorkCode(workTitle, workUrl)
     return dataForHtmlGeneration
 }
 
 export {
     defaultAttributes, CC0Attributes, CCBYAttributes, shortToAttr, attrToShort,
-    attrToFull, licenseUrl, licenseSlug, licenseIconsArr, generateHTML, updateVisibleEnabledStatus
+    attrToFull, licenseUrl, licenseSlug, licenseIconsArr, generateHTML, updateVisibleEnabledStatus,
+    CC_NAMESPACE, DCT_NAMESPACE, LICENSES, ICON_STYLE, ICON_BASE_URL
 }
diff --git a/src/utils/licenses.js b/src/utils/licenses.js
new file mode 100644
index 00000000..ac258d1b
--- /dev/null
+++ b/src/utils/licenses.js
@@ -0,0 +1,99 @@
+/** @typedef {{ATTRIBUTES: LicenseAttributes, SLUG: string, FULL: string, URL: string, SHORT: string}} LicenseProperties */
+
+/**
+ *
+ * @type {{CC0: LicenseProperties, CC_BY: LicenseProperties, CC_BY_NC:LicenseProperties, CC_BY_NC_SA: LicenseProperties, CC_BY_ND: LicenseProperties, CC_BY_SA: LicenseProperties, CC_BY_NC_ND: LicenseProperties}}
+ */
+export const LICENSES = {
+    CC0: {
+        ATTRIBUTES: {
+            BY: false,
+            SA: false,
+            NC: false,
+            ND: false
+        },
+        FULL: 'CC0 1.0 Universal',
+        SHORT: 'CC0 1.0',
+        SLUG: 'cc0',
+        URL: 'https://creativecommons.org/publicdomain/zero/1.0',
+        ICONS: ['cc', 'zero']
+    },
+    CC_BY: {
+        ATTRIBUTES: {
+            BY: true,
+            SA: false,
+            NC: false,
+            ND: false
+        },
+        FULL: 'Attribution 4.0 International',
+        SHORT: 'CC BY 4.0',
+        SLUG: 'cc-by',
+        URL: 'https://creativecommons.org/licenses/by/4.0',
+        ICONS: ['cc', 'by']
+    },
+    CC_BY_SA: {
+        ATTRIBUTES: {
+            BY: true,
+            SA: true,
+            NC: false,
+            ND: false
+        },
+        FULL: 'Attribution-ShareAlike 4.0 International',
+        SHORT: 'CC BY-SA 4.0',
+        SLUG: 'cc-by-sa',
+        URL: 'https://creativecommons.org/licenses/by-sa/4.0',
+        ICONS: ['cc', 'by', 'sa']
+    },
+    CC_BY_NC: {
+        ATTRIBUTES: {
+            BY: true,
+            SA: false,
+            NC: true,
+            ND: false
+        },
+        FULL: 'Attribution-NonCommercial 4.0 International',
+        SHORT: 'CC BY-NC 4.0',
+        SLUG: 'cc-by-nc',
+        URL: 'https://creativecommons.org/licenses/by-nc/4.0',
+        ICONS: ['cc', 'by', 'nc']
+    },
+    CC_BY_NC_SA: {
+        ATTRIBUTES: {
+            BY: true,
+            SA: true,
+            NC: true,
+            ND: false
+        },
+        FULL: 'Attribution-NonCommercial-ShareAlike 4.0 International',
+        SHORT: 'CC BY-NC-SA 4.0',
+        SLUG: 'cc-by-nc-sa',
+        URL: 'https://creativecommons.org/licenses/by-nc-sa/4.0',
+        ICONS: ['cc', 'by', 'nc', 'sa']
+    },
+    CC_BY_NC_ND: {
+        ATTRIBUTES: {
+            BY: true,
+            SA: false,
+            NC: true,
+            ND: true
+        },
+        FULL: 'Attribution-NonCommercial-NoDerivatives 4.0 International',
+        SHORT: 'CC BY-NC-ND 4.0',
+        SLUG: 'cc-by-nc-nd',
+        URL: 'https://creativecommons.org/licenses/by-nc-nd/4.0',
+        ICONS: ['cc', 'by', 'nc', 'nd']
+    },
+    CC_BY_ND: {
+        ATTRIBUTES: {
+            BY: true,
+            SA: false,
+            NC: false,
+            ND: true
+        },
+        FULL: 'Attribution-NoDerivatives 4.0 International',
+        SHORT: 'CC BY-ND 4.0',
+        SLUG: 'cc-by-nd',
+        URL: 'https://creativecommons.org/licenses/by-nd/4.0',
+        ICONS: ['cc', 'by', 'nd']
+    }
+}
diff --git a/tests/e2e/specs/LicenseCode.js b/tests/e2e/specs/LicenseCode.js
index 16418a4f..b8d00f8d 100644
--- a/tests/e2e/specs/LicenseCode.js
+++ b/tests/e2e/specs/LicenseCode.js
@@ -22,12 +22,10 @@ module.exports = {
             .setValue('input[placeholder="www.author.com/work.jpg"]', 'www.author.com/work.jpg')
             .assert.elementPresent('p[class="license-text"] a')
             .getAttribute('p > span > a:nth-child(1)', 'href', function(result) {
-                const urlString = result.value.split('/').slice(3).join('/')
-                this.assert.equal(urlString, 'www.author.com/work.jpg')
+                this.assert.equal(result.value, 'http://www.author.com/work.jpg')
             })
             .getAttribute('p > span > a:nth-child(2)', 'href', function(result) {
-                const urlString = result.value.split('/').slice(3).join('/')
-                this.assert.equal(urlString, 'www.author.com')
+                this.assert.equal(result.value, 'http://www.author.com/')
             })
             .getAttribute('p > span > a:nth-child(4)', 'href', function(result) {
                 const urlString = result.value.split('/').slice(3).join('/')
diff --git a/tests/unit/specs/components/LicenseCode.spec.js b/tests/unit/specs/components/LicenseCode.spec.js
index d885a60d..93313d0c 100644
--- a/tests/unit/specs/components/LicenseCode.spec.js
+++ b/tests/unit/specs/components/LicenseCode.spec.js
@@ -1,42 +1,39 @@
-import { mount, createLocalVue, config } from '@vue/test-utils'
-import LicenseCode from '@/components/LicenseCode.vue'
-import VueI18n from 'vue-i18n'
 import Vuex from 'vuex'
+import VueI18n from 'vue-i18n'
+import { mount, createLocalVue } from '@vue/test-utils'
+import LicenseCode from '@/components/LicenseCode.vue'
+import createStore from '@/store'
+import { CCBYAttributes } from '@/utils/license-utilities'
+
+const TEST_DATA = {
+    creatorName: 'Jane Doe',
+    creatorProfileUrl: 'www.author.com',
+    workTitle: 'My work',
+    workUrl: 'www.author.com/picture.jpg'
+}
 
 describe('LicenseCode.vue', () => {
     let wrapper
     let state
-    let store
+    let localVue
 
-    // Always creates a shallow instance of component
+    // Vue i18n is looking for locale key in messages,
+    // i.e. $t('app') becomes 'messages.<en>.app'
+    const messages = {}
+    messages.en = require('@/locales/en.json')
     beforeEach(() => {
-        const localVue = createLocalVue()
+        localVue = createLocalVue()
         localVue.use(VueI18n)
         localVue.use(Vuex)
-        state = {
-            attributionDetails: {
-                creatorName: '',
-                creatorProfileUrl: 'www.author.com',
-                workTitle: 'My work',
-                workUrl: 'www.author.com/pic.jpg'
-            }
-        }
-        store = new Vuex.Store({
-            state
-        })
-        const messages = require('@/locales/en.json')
+        // License Code is only available after the User selects a license,
+        // so we do not need to test blank license attributes
+        state = { currentLicenseAttributes: CCBYAttributes }
+        const store = createStore(state)
         const i18n = new VueI18n({
             locale: 'en',
-            fallbackLocale: 'en',
-            messages: messages,
-            silentTranslationWarn: true
+            messages: messages
         })
 
-        config.mocks.i18n = i18n
-
-        config.mocks.$t = (key) => {
-            return i18n.messages[key]
-        }
         wrapper = mount(LicenseCode, {
             localVue,
             store,
@@ -44,58 +41,28 @@ describe('LicenseCode.vue', () => {
         })
     })
 
-    // Test for DOM elements which must be present
-    it('Check if the p-tag with class license-text is present in the DOM', () => {
-        expect(wrapper.contains('.license-text')).toBe(true)
-    })
-
-    it('Check if the LicenseCode.vue component renders without any errors', () => {
+    it('it renders without any errors', () => {
         expect(wrapper.isVueInstance()).toBeTruthy()
     })
-
-    // Tests for computed props and methods
-    it('Check the creatorSpan function returns else text correctly', () => {
-        expect(wrapper.vm.creatorSpan).toBe('')
-    })
-    it('Check if the byString function returns else text correctly', () => {
-        expect(wrapper.vm.byString).toBe('')
-    })
-    it('Check if the byString function returns the correct text', () => {
-        state.attributionDetails.creatorName = 'J Doe'
-        expect(wrapper.vm.byString).toBe('license-use.richtext.by')
-    })
-    it('Check if the creatorSpan function returns the correct text', () => {
-        state.attributionDetails.creatorName = 'J Doe'
-        expect(wrapper.vm.creatorSpan).toBe('<span property="cc:attributionName">J Doe</span>')
-    })
-    it('Check if the creatorName function returns the correct text', () => {
-        state.attributionDetails.creatorName = 'J Doe'
-        expect(wrapper.vm.creatorName).toBe('J Doe')
-    })
-    it('Check if the creatorProfileUrl function returns the correct text', () => {
-        expect(wrapper.vm.creatorProfileUrl).toBe('www.author.com')
-    })
-    it('Check if the workTitle function returns the correct text', () => {
-        expect(wrapper.vm.workTitle).toBe('My work')
-    })
-    it('Check if the workUrl function returns the correct text', () => {
-        expect(wrapper.vm.workUrl).toBe('www.author.com/pic.jpg')
+    it('has the expected UI', () => {
+        expect(wrapper).toMatchSnapshot()
     })
-    it('Check if the isWeb function returns true if attribution type is web', () => {
-        wrapper.setProps({
-            attributionType: 'web'
-        })
-        expect(wrapper.vm.isWeb).toBe(true)
+    it('has correct information when creator name and work title are provided', () => {
+        wrapper.vm.$store.commit('setCreatorName', TEST_DATA.creatorName)
+        wrapper.vm.$store.commit('setWorkTitle', TEST_DATA.workTitle)
+        expect(wrapper).toMatchSnapshot()
     })
-    it('Check if the isWeb function returns false if attribution type is print', () => {
-        wrapper.setProps({
-            attributionType: 'print'
-        })
-        expect(wrapper.vm.isWeb).toBe(false)
+    it('has correct information when only urls are provided', () => {
+        wrapper.vm.$store.commit('setCreatorProfileUrl', TEST_DATA.creatorProfileUrl)
+        wrapper.vm.$store.commit('setWorkUrl', TEST_DATA.workUrl)
+        expect(wrapper).toMatchSnapshot()
     })
-
-    // Snapshot tests
-    it('has the expected UI', () => {
+    it('has correct information all data are provided', () => {
+        wrapper.vm.$store.commit('setCreatorName', TEST_DATA.creatorName)
+        wrapper.vm.$store.commit('setWorkTitle', TEST_DATA.workTitle)
+        wrapper.vm.$store.commit('setCreatorProfileUrl', TEST_DATA.creatorProfileUrl)
+        wrapper.vm.$store.commit('setWorkUrl', TEST_DATA.workUrl)
+        console.log(wrapper.html())
         expect(wrapper).toMatchSnapshot()
     })
 })
diff --git a/tests/unit/specs/components/__snapshots__/LicenseCode.spec.js.snap b/tests/unit/specs/components/__snapshots__/LicenseCode.spec.js.snap
index d8bf7fe6..66d47694 100644
--- a/tests/unit/specs/components/__snapshots__/LicenseCode.spec.js.snap
+++ b/tests/unit/specs/components/__snapshots__/LicenseCode.spec.js.snap
@@ -1,7 +1,49 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`LicenseCode.vue has correct information all data are provided 1`] = `
+<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text"><span><a href="http://www.author.com/picture.jpg" rel="cc:attributionURL" property="dct:title">
+                My work
+            </a> 
+            by
+         <a href="http://www.author.com" rel="cc:attributionURL"><span property="cc:attributionName">Jane Doe</span></a><span> is licensed under </span><a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display: inline-block;">
+    CC BY 4.0
+  </a> <a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="noopener noreferrer" class="photo-license-icons"><img alt="CC icon" title="CC icon" src="../assets/license-icons/cc.svg" class="photo-license-icon"> <img alt="by icon" title="by icon" src="[object Object]" class="photo-license-icon"></a></span>
+  <!---->
+</p>
+`;
+
+exports[`LicenseCode.vue has correct information when creator name and work title are provided 1`] = `
+<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text"><span><span property="dct:title">
+                My work
+            </span>
+  by
+  <span><span property="cc:attributionName">Jane Doe</span></span><span> is licensed under </span><a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display: inline-block;">
+    CC BY 4.0
+  </a> <a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="noopener noreferrer" class="photo-license-icons"><img alt="CC icon" title="CC icon" src="../assets/license-icons/cc.svg" class="photo-license-icon"> <img alt="by icon" title="by icon" src="[object Object]" class="photo-license-icon"></a></span>
+  <!---->
+</p>
+`;
+
+exports[`LicenseCode.vue has correct information when only urls are provided 1`] = `
+<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text"><span><a href="http://www.author.com/picture.jpg" rel="cc:attributionURL" property="dct:title">
+                My work
+            </a> 
+            by
+         <a href="http://www.author.com" rel="cc:attributionURL"><span property="cc:attributionName">Jane Doe</span></a><span> is licensed under </span><a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display: inline-block;">
+    CC BY 4.0
+  </a> <a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="noopener noreferrer" class="photo-license-icons"><img alt="CC icon" title="CC icon" src="../assets/license-icons/cc.svg" class="photo-license-icon"> <img alt="by icon" title="by icon" src="[object Object]" class="photo-license-icon"></a></span>
+  <!---->
+</p>
+`;
+
 exports[`LicenseCode.vue has the expected UI 1`] = `
-<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text"><span>license-use.richtext.full-text</span>
+<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text"><span><span property="dct:title">
+                This work
+            </span>
+
+  <span> is licensed under </span><a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display: inline-block;">
+    CC BY 4.0
+  </a> <a href="https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1" target="_blank" rel="noopener noreferrer" class="photo-license-icons"><img alt="CC icon" title="CC icon" src="../assets/license-icons/cc.svg" class="photo-license-icon"> <img alt="by icon" title="by icon" src="[object Object]" class="photo-license-icon"></a></span>
   <!---->
 </p>
 `;
diff --git a/tests/unit/specs/utils/TestComponent.vue b/tests/unit/specs/utils/TestComponent.vue
new file mode 100644
index 00000000..251146a7
--- /dev/null
+++ b/tests/unit/specs/utils/TestComponent.vue
@@ -0,0 +1,34 @@
+<template>
+    <div>
+        <div
+            class="creator"
+            v-html="attribution.creator"
+        />
+        <div
+            class="html-string"
+            v-html="attribution.paragraph"
+        />
+        <div
+            class="license-link"
+            v-html="attribution.license"
+        />
+        <div
+            class="work-title"
+            v-html="attribution.work"
+        />
+    </div>
+</template>
+<script>
+export default {
+    name: 'TestComponent',
+    props: {
+        attribution: {
+            type: Object,
+            required: true
+        }
+    }
+}
+</script>
+
+<style scoped>
+</style>
diff --git a/tests/unit/specs/utils/license-uilities.test.js b/tests/unit/specs/utils/license-uilities.test.js
deleted file mode 100644
index 9e362981..00000000
--- a/tests/unit/specs/utils/license-uilities.test.js
+++ /dev/null
@@ -1,955 +0,0 @@
-/* eslint no-undef: 0 */
-import {
-    attrToFull,
-    attrToShort,
-    licenseIconsArr,
-    licenseSlug,
-    licenseUrl,
-    shortToAttr,
-    updateVisibleEnabledStatus
-} from '@/utils/license-utilities'
-
-describe('attrToFull', function testAttrToFull() {
-    test('CC0 #1', () => {
-        const attr = {}
-        expect(attrToFull(attr)).toBeUndefined()
-    })
-    test('CC0 #2', () => {
-        const attr = { BY: false }
-        expect(attrToFull(attr)).toBe('CC0 1.0 Universal')
-    })
-    test('CC0 #3', () => {
-        const attr = { SA: false, BY: false }
-        expect(attrToFull(attr)).toBe('CC0 1.0 Universal')
-    })
-    test('CC BY', () => {
-        const attr = { BY: true }
-        expect(attrToFull(attr)).toBe('Attribution 4.0 International')
-    })
-    test('CC BY-SA', () => {
-        const attr = { BY: true, SA: true }
-        expect(attrToFull(attr)).toBe(
-            'Attribution-ShareAlike 4.0 International'
-        )
-    })
-    test('CC BY-NC', () => {
-        const attr = { BY: true, NC: true }
-        expect(attrToFull(attr)).toBe(
-            'Attribution-NonCommercial 4.0 International'
-        )
-    })
-    test('CC BY-NC-SA', () => {
-        const attr = { BY: true, NC: true, SA: true }
-        expect(attrToFull(attr)).toBe(
-            'Attribution-NonCommercial-ShareAlike 4.0 International'
-        )
-    })
-    test('CC BY-ND', () => {
-        const attr = { BY: true, ND: true }
-        expect(attrToFull(attr)).toBe(
-            'Attribution-NoDerivatives 4.0 International'
-        )
-    })
-    test('CC BY-NC-ND', () => {
-        const attr = { BY: true, ND: true, NC: true }
-        expect(attrToFull(attr)).toBe(
-            'Attribution-NonCommercial-NoDerivatives 4.0 International'
-        )
-    })
-    test('SA, ND: true', () => {
-        const attr = { BY: true, SA: true, ND: true }
-        expect(attrToFull(attr)).toBe(
-            'Attribution-NoDerivatives 4.0 International'
-        )
-    })
-})
-
-describe('attrToShort', function testAttrToShort() {
-    test('undefined BY', () => {
-        const attr = { BY: undefined }
-        expect(attrToShort(attr)).toBeUndefined()
-    })
-    test('CC0 #1', () => {
-        const attr = { BY: false }
-        expect(attrToShort(attr)).toBe('CC0 1.0')
-    })
-    test('CC0 #2', () => {
-        const attr = { SA: false, BY: false }
-        expect(attrToShort(attr)).toBe('CC0 1.0')
-    })
-    test('CC BY', () => {
-        const attr = { BY: true }
-        expect(attrToShort(attr)).toBe('CC BY 4.0')
-    })
-    test('CC BY-SA', () => {
-        const attr = { BY: true, SA: true }
-        expect(attrToShort(attr)).toBe('CC BY-SA 4.0')
-    })
-    test('CC BY-NC', () => {
-        const attr = { BY: true, NC: true }
-        expect(attrToShort(attr)).toBe('CC BY-NC 4.0')
-    })
-    test('CC BY-NC-SA', () => {
-        const attr = { BY: true, NC: true, SA: true }
-        expect(attrToShort(attr)).toBe('CC BY-NC-SA 4.0')
-    })
-    test('CC BY-ND', () => {
-        const attr = { BY: true, ND: true }
-        expect(attrToShort(attr)).toBe('CC BY-ND 4.0')
-    })
-    test('CC BY-NC-ND', () => {
-        const attr = { BY: true, ND: true, NC: true }
-        expect(attrToShort(attr)).toBe('CC BY-NC-ND 4.0')
-    })
-})
-
-describe('shortToAttr', function testAttrToShort() {
-    test('gibrish string #1', () => {
-        const str = 'gibrish'
-        expect(shortToAttr(str)).not.toEqual({ BY: true })
-    })
-    test('gibrish string #2', () => {
-        const str = 'GATSBY'
-        expect(shortToAttr(str)).toEqual({
-            BY: true,
-            NC: false,
-            ND: false,
-            SA: false
-        })
-    })
-    test('CC0 1.0', () => {
-        const str = 'CC0'
-        expect(shortToAttr(str)).toEqual({
-            BY: false,
-            NC: false,
-            ND: false,
-            SA: false
-        })
-    })
-    test('CC BY 2.5', () => {
-        const str = 'CC BY 2.5'
-        expect(shortToAttr(str)).toEqual({
-            BY: true,
-            NC: false,
-            ND: false,
-            SA: false
-        })
-    })
-    test('CC BY-SA 4.0', () => {
-        const str = 'CC BY-SA 4.0'
-        expect(shortToAttr(str)).toEqual({
-            BY: true,
-            NC: false,
-            ND: false,
-            SA: true
-        })
-    })
-    test('CC BY-NC 4.0', () => {
-        const str = 'CC BY-NC 4.0'
-        expect(shortToAttr(str)).toEqual({
-            BY: true,
-            NC: true,
-            ND: false,
-            SA: false
-        })
-    })
-    test('CC BY-NC-SA 4.0', () => {
-        const str = 'CC BY-NC-SA 4.0'
-        expect(shortToAttr(str)).toEqual({
-            BY: true,
-            NC: true,
-            ND: false,
-            SA: true
-        })
-    })
-    test('CC BY-ND 4.0', () => {
-        const str = 'CC BY-ND 4.0'
-        expect(shortToAttr(str)).toEqual({
-            BY: true,
-            NC: false,
-            ND: true,
-            SA: false
-        })
-    })
-    test('CC BY-NC-ND 4.0', () => {
-        const str = 'CC BY-NC-ND 4.0'
-        expect(shortToAttr(str)).toEqual({
-            BY: true,
-            NC: true,
-            ND: true,
-            SA: false
-        })
-    })
-})
-
-describe('licenseSlug', function testLicenseSlug() {
-    test('CC0 1.0', () => {
-        const str = 'CC0 1.0'
-        expect(licenseSlug(str)).toBe('cc0')
-    })
-    test('CC BY 4.0', () => {
-        const str = 'CC BY 4.0'
-        expect(licenseSlug(str)).toBe('cc-by')
-    })
-    test('CC BY-SA 4.0', () => {
-        const str = 'CC BY-SA 4.0'
-        expect(licenseSlug(str)).toBe('cc-by-sa')
-    })
-    test('CC BY-NC 4.0', () => {
-        const str = 'CC BY-NC 4.0'
-        expect(licenseSlug(str)).toBe('cc-by-nc')
-    })
-    test('CC BY-NC-SA 4.0', () => {
-        const str = 'CC BY-NC-SA 4.0'
-        expect(licenseSlug(str)).toBe('cc-by-nc-sa')
-    })
-    test('CC BY-ND 4.0', () => {
-        const str = 'CC BY-ND 4.0'
-        expect(licenseSlug(str)).toBe('cc-by-nd')
-    })
-    test('CC BY-NC-ND 4.0', () => {
-        const str = 'CC BY-NC-ND 4.0'
-        expect(licenseSlug(str)).toBe('cc-by-nc-nd')
-    })
-})
-
-describe('licenseIconsArr', function testLicenseIconsArr() {
-    test('CC0 #1: empty attr', () => {
-        const attr = {}
-        expect(licenseIconsArr(attr)).toEqual(['zero'])
-    })
-    test('CC0 #2: BY: false', () => {
-        const attr = { BY: false }
-        expect(licenseIconsArr(attr)).toEqual(['zero'])
-    })
-    test('CC BY', () => {
-        const attr = { BY: true }
-        expect(licenseIconsArr(attr)).toEqual(['by'])
-    })
-    test('CC BY SA', () => {
-        const attr = { BY: true, SA: true }
-        expect(licenseIconsArr(attr)).toEqual(['by', 'sa'])
-    })
-    test('CC BY NC', () => {
-        const attr = { BY: true, NC: true }
-        expect(licenseIconsArr(attr)).toEqual(['by', 'nc'])
-    })
-    test('CC BY NC SA', () => {
-        const attr = { BY: true, NC: true, SA: true }
-        expect(licenseIconsArr(attr)).toEqual(['by', 'nc', 'sa'])
-    })
-    test('CC BY ND', () => {
-        const attr = { BY: true, ND: true }
-        expect(licenseIconsArr(attr)).toEqual(['by', 'nd'])
-    })
-    test('CC BY NC ND', () => {
-        const attr = { BY: true, NC: true, ND: true }
-        expect(licenseIconsArr(attr)).toEqual(['by', 'nc', 'nd'])
-    })
-})
-
-describe('licenseUrl', function testLicenseUrl() {
-    const web = 'web'
-    test('CC0 web', () => {
-        const attr = { BY: false }
-        expect(licenseUrl(attr, web)).toBe('https://creativecommons.org/publicdomain/zero/1.0/?ref=chooser-v1')
-    })
-    test('CC0 no web', () => {
-        const attr = { BY: false }
-        expect(licenseUrl(attr)).toBe('https://creativecommons.org/publicdomain/zero/1.0')
-    })
-    test('CC BY web', () => {
-        const attr = { BY: true }
-        expect(licenseUrl(attr, web)).toBe('https://creativecommons.org/licenses/by/4.0/?ref=chooser-v1')
-    })
-    test('CC BY no web', () => {
-        const attr = { BY: true }
-        expect(licenseUrl(attr)).toBe('https://creativecommons.org/licenses/by/4.0')
-    })
-    test('CC BY-SA web', () => {
-        const attr = { BY: true, SA: true }
-        expect(licenseUrl(attr, web)).toBe('https://creativecommons.org/licenses/by-sa/4.0/?ref=chooser-v1')
-    })
-    test('CC BY-SA no web', () => {
-        const attr = { BY: true, SA: true }
-        expect(licenseUrl(attr)).toBe('https://creativecommons.org/licenses/by-sa/4.0')
-    })
-    test('CC BY-NC web', () => {
-        const attr = { BY: true, NC: true }
-        expect(licenseUrl(attr, web)).toBe('https://creativecommons.org/licenses/by-nc/4.0/?ref=chooser-v1')
-    })
-    test('CC BY-NC no web', () => {
-        const attr = { BY: true, NC: true }
-        expect(licenseUrl(attr)).toBe('https://creativecommons.org/licenses/by-nc/4.0')
-    })
-    test('CC BY-NC-SA web', () => {
-        const attr = { BY: true, NC: true, SA: true }
-        expect(licenseUrl(attr, web)).toBe('https://creativecommons.org/licenses/by-nc-sa/4.0/?ref=chooser-v1')
-    })
-    test('CC BY-NC-SA no web', () => {
-        const attr = { BY: true, NC: true, SA: true }
-        expect(licenseUrl(attr)).toBe('https://creativecommons.org/licenses/by-nc-sa/4.0')
-    })
-    test('CC BY-ND web', () => {
-        const attr = { BY: true, ND: true }
-        expect(licenseUrl(attr, web)).toBe('https://creativecommons.org/licenses/by-nd/4.0/?ref=chooser-v1')
-    })
-    test('CC BY-ND no web', () => {
-        const attr = { BY: true, ND: true }
-        expect(licenseUrl(attr)).toBe('https://creativecommons.org/licenses/by-nd/4.0')
-    })
-    test('CC BY-NC-ND web', () => {
-        const attr = { BY: true, NC: true, ND: true }
-        expect(licenseUrl(attr, web)).toBe('https://creativecommons.org/licenses/by-nc-nd/4.0/?ref=chooser-v1')
-    })
-    test('CC BY-NC-ND no web', () => {
-        const attr = { BY: true, NC: true, ND: true }
-        expect(licenseUrl(attr)).toBe('https://creativecommons.org/licenses/by-nc-nd/4.0')
-    })
-})
-
-describe('updateVisibleEnabledStatus', function testUpdateVisibleEnabledStatus() {
-    test('empty object', () => {
-        const attr = {}
-        expect(updateVisibleEnabledStatus(attr)).toEqual({
-            enabled: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD'],
-            stepsDisabledDue: '',
-            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD']
-        })
-    })
-    test('FS: true, BY: false', () => {
-        const attr = { FS: true, BY: false }
-        expect(updateVisibleEnabledStatus(attr)).toEqual({
-            enabled: ['FS', 'DD', 'CW', 'AD'],
-            stepsDisabledDue: 'CC0',
-            visible: ['FS', 'DD', 'CW', 'AD']
-        })
-    })
-    test('FS: true, BY: true ', () => {
-        const attr = { FS: true, BY: true }
-        expect(updateVisibleEnabledStatus(attr)).toEqual({
-            enabled: ['FS', 'DD', 'AD'],
-            stepsDisabledDue: '',
-            visible: ['FS', 'DD', 'AD']
-        })
-    })
-    test('FS: false, BY: false', () => {
-        const attr = { FS: false, BY: false }
-        expect(updateVisibleEnabledStatus(attr)).toEqual({
-            enabled: ['FS', 'BY', 'CW', 'AD'],
-            stepsDisabledDue: 'CC0',
-            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'CW', 'AD']
-        })
-    })
-    test('FS: false, BY: true, ND: true', () => {
-        const attr = { FS: false, BY: true, ND: true }
-        expect(updateVisibleEnabledStatus(attr)).toEqual({
-            enabled: ['FS', 'BY', 'NC', 'ND', 'AD'],
-            stepsDisabledDue: 'CC0',
-            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD']
-        })
-    })
-    test('FS: false, BY: true, ND: false', () => {
-        const attr = { FS: false, BY: true, ND: false }
-        expect(updateVisibleEnabledStatus(attr)).toEqual({
-            enabled: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD'],
-            stepsDisabledDue: '',
-            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD']
-        })
-    })
-})
-
-// describe('generateHTML CC0', function testGenerateHTML() {
-//     const license = 'CC0 1.0'
-//     test('empty attr', () => {
-//         const attr = {}
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name', () => {
-//         const attr = { creatorName: 'John' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">John</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name + url', () => {
-//         const attr = { creatorName: 'John', creatorProfileUrl: 'j@doe.com' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">John</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('work title', () => {
-//         const attr = { workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('work title + url', () => {
-//         const attr = { workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name; work title', () => {
-//         const attr = { workTitle: 'Foo', creatorName: 'Jane' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name + url; work title', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name; work title + url', () => {
-//         const attr = { creatorName: 'Jane', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name + url; work title + url', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/publicdomain/zero/1.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-cc0_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-// })
-//
-// describe('generateHTML CC BY', function testGenerateHTML() {
-//     const license = 'CC BY 4.0'
-//     test('empty attr', () => {
-//         const attr = {}
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name', () => {
-//         const attr = { creatorName: 'John' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">John</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name + url', () => {
-//         const attr = { creatorName: 'John', creatorProfileUrl: 'j@doe.com' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">John</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('work title', () => {
-//         const attr = { workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('work title + url', () => {
-//         const attr = { workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name; work title', () => {
-//         const attr = { workTitle: 'Foo', creatorName: 'Jane' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name + url; work title', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name; work title + url', () => {
-//         const attr = { creatorName: 'Jane', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name + url; work title + url', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-// })
-//
-// describe('generateHTML CC BY-SA', function testGenerateHTML() {
-//     const license = 'CC BY-SA 4.0'
-//     test('empty attr', () => {
-//         const attr = {}
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name', () => {
-//         const attr = { creatorName: 'John' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">John</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name + url', () => {
-//         const attr = { creatorName: 'John', creatorProfileUrl: 'j@doe.com' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">John</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('work title', () => {
-//         const attr = { workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('work title + url', () => {
-//         const attr = { workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name; work title', () => {
-//         const attr = { workTitle: 'Foo', creatorName: 'Jane' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name + url; work title', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name; work title + url', () => {
-//         const attr = { creatorName: 'Jane', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name + url; work title + url', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-// })
-//
-// describe('generateHTML CC BY-NC', function testGenerateHTML() {
-//     const license = 'CC BY-NC 4.0'
-//     test('empty attr', () => {
-//         const attr = {}
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name', () => {
-//         const attr = { creatorName: 'John' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">John</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name + url', () => {
-//         const attr = { creatorName: 'John', creatorProfileUrl: 'j@doe.com' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">John</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('work title', () => {
-//         const attr = { workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('work title + url', () => {
-//         const attr = { workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name; work title', () => {
-//         const attr = { workTitle: 'Foo', creatorName: 'Jane' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name + url; work title', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name; work title + url', () => {
-//         const attr = { creatorName: 'Jane', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name + url; work title + url', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-// })
-//
-// describe('generateHTML CC BY-NC-SA', function testGenerateHTML() {
-//     const license = 'CC BY-NC-SA 4.0'
-//     test('empty attr', () => {
-//         const attr = {}
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name', () => {
-//         const attr = { creatorName: 'John' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">John</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name + url', () => {
-//         const attr = { creatorName: 'John', creatorProfileUrl: 'j@doe.com' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">John</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('work title', () => {
-//         const attr = { workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('work title + url', () => {
-//         const attr = { workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name; work title', () => {
-//         const attr = { workTitle: 'Foo', creatorName: 'Jane' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name + url; work title', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name; work title + url', () => {
-//         const attr = { creatorName: 'Jane', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name + url; work title + url', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-sa_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-// })
-//
-// describe('generateHTML CC BY-ND', function testGenerateHTML() {
-//     const license = 'CC BY-ND 4.0'
-//     test('empty attr', () => {
-//         const attr = {}
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name', () => {
-//         const attr = { creatorName: 'John' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">John</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name + url', () => {
-//         const attr = { creatorName: 'John', creatorProfileUrl: 'j@doe.com' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">John</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('work title', () => {
-//         const attr = { workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('work title + url', () => {
-//         const attr = { workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name; work title', () => {
-//         const attr = { workTitle: 'Foo', creatorName: 'Jane' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name + url; work title', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name; work title + url', () => {
-//         const attr = { creatorName: 'Jane', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name + url; work title + url', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-// })
-//
-// describe('generateHTML CC BY-NC-ND', function testGenerateHTML() {
-//     const license = 'CC BY-NC-ND 4.0'
-//     test('empty attr', () => {
-//         const attr = {}
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name', () => {
-//         const attr = { creatorName: 'John' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">John</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('creator name + url', () => {
-//         const attr = { creatorName: 'John', creatorProfileUrl: 'j@doe.com' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">John</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: ''
-//         })
-//     })
-//     test('work title', () => {
-//         const attr = { workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('work title + url', () => {
-//         const attr = { workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name; work title', () => {
-//         const attr = { workTitle: 'Foo', creatorName: 'Jane' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name + url; work title', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<span property="dct:title">Foo</span>'
-//         })
-//     })
-//     test('creator name; work title + url', () => {
-//         const attr = { creatorName: 'Jane', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<span property="cc:attributionName">Jane</span>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-//     test('creator name + url; work title + url', () => {
-//         const attr = { creatorName: 'Jane', creatorProfileUrl: 'j@doe.com', workTitle: 'Foo', workUrl: 'www.foo.bar' }
-//         expect(generateHTML(attr, license)).toEqual({
-//             creator: '<a rel="cc:attributionURL" href="j@doe.com"><span property="cc:attributionName">Jane</span></a>',
-//             htmlString: '<p xmlns:dct="http://purl.org/dc/terms/" xmlns:cc="http://creativecommons.org/ns#" class="license-text">',
-//             licenseIconsLink: '<a href="https://creativecommons.org/licenses/by-nc-nd/4.0"><img style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-by_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nc_icon.svg" /><img  style="height:22px!important;margin-left: 3px;vertical-align:text-bottom;" src="https://search.creativecommons.org/static/img/cc-nd_icon.svg" /></a>',
-//             workTitle: '<a rel="cc:attributionURL" href="www.foo.bar"><span property="dct:title">Foo</span></a>'
-//         })
-//     })
-// })
diff --git a/tests/unit/specs/utils/license-utilities.test.js b/tests/unit/specs/utils/license-utilities.test.js
new file mode 100644
index 00000000..c76077a7
--- /dev/null
+++ b/tests/unit/specs/utils/license-utilities.test.js
@@ -0,0 +1,304 @@
+/* eslint-disable no-undef */
+import {
+    attrToFull,
+    attrToShort,
+    generateHTML,
+    licenseIconsArr,
+    licenseSlug,
+    licenseUrl,
+    shortToAttr,
+    updateVisibleEnabledStatus,
+    LICENSES,
+    CC_NAMESPACE,
+    DCT_NAMESPACE,
+    ICON_BASE_URL,
+    ICON_STYLE
+} from '@/utils/license-utilities'
+import { mount } from '@vue/test-utils'
+import TestComponent from './TestComponent'
+
+const attributesToTest = [
+    {
+        attr: {},
+        fullResult: undefined
+    },
+    {
+        attr: { BY: false },
+        fullResult: LICENSES.CC0.FULL,
+        shortResult: LICENSES.CC0.SHORT
+    },
+    {
+        attr: { SA: false, BY: false },
+        fullResult: LICENSES.CC0.FULL,
+        shortResult: LICENSES.CC0.SHORT
+    },
+    {
+        attr: { BY: true },
+        fullResult: LICENSES.CC_BY.FULL,
+        shortResult: LICENSES.CC_BY.SHORT
+    }
+
+]
+describe('attrToFull edge cases', function testAttrToFull() {
+    attributesToTest.forEach((option) => {
+        const { attr, fullResult } = option
+        it(`Attributes ${JSON.stringify(attr)} should return <${fullResult}>`, () => {
+            expect(attrToFull(attr)).toEqual(fullResult)
+        })
+    })
+})
+describe('attrToFull all licenses', () => {
+    Object.values(LICENSES).forEach((license) => {
+        const { ATTRIBUTES: attr, FULL: result } = license
+        it(`${JSON.stringify(attr)} should return <${result}>`, () => {
+            expect(attrToFull(attr)).toEqual(result)
+        })
+    })
+})
+describe('attrToShort all licenses', () => {
+    Object.values(LICENSES).forEach((license) => {
+        const { ATTRIBUTES: attr, SHORT: result } = license
+        it(`${JSON.stringify(attr)} should return <${result}>`, () => {
+            expect(attrToShort(attr)).toEqual(result)
+        })
+    })
+})
+describe('shortToAttr all licenses', () => {
+    Object.values(LICENSES).forEach((license) => {
+        const { ATTRIBUTES: attr, SHORT: short } = license
+        it(`<${short}> should return ${JSON.stringify(attr)}`, () => {
+            expect(shortToAttr(short)).toEqual(attr)
+        })
+    })
+})
+describe('license slug', () => {
+    Object.values(LICENSES).forEach((license) => {
+        const { SHORT: short, SLUG: slug } = license
+        it(`<${short}> should return ${slug}`, () => {
+            expect(licenseSlug(short)).toEqual(slug)
+        })
+    })
+})
+
+describe('shortToAttr', function testAttrToShort() {
+    test('gibberish string #1', () => {
+        const str = 'CC 4.0'
+        expect(shortToAttr(str)).toEqual(undefined)
+    })
+})
+
+describe('licenseIconsArr', function testLicenseIconsArr() {
+    test('CC0 #1: empty attr', () => {
+        const attr = {}
+        expect(licenseIconsArr(attr)).toEqual(['zero'])
+    })
+    test('CC0 #2: BY: false', () => {
+        const attr = { BY: false }
+        expect(licenseIconsArr(attr)).toEqual(['zero'])
+    })
+    test('CC BY', () => {
+        const attr = { BY: true }
+        expect(licenseIconsArr(attr)).toEqual(['by'])
+    })
+    test('CC BY SA', () => {
+        const attr = { BY: true, SA: true }
+        expect(licenseIconsArr(attr)).toEqual(['by', 'sa'])
+    })
+    test('CC BY NC', () => {
+        const attr = { BY: true, NC: true }
+        expect(licenseIconsArr(attr)).toEqual(['by', 'nc'])
+    })
+    test('CC BY NC SA', () => {
+        const attr = { BY: true, NC: true, SA: true }
+        expect(licenseIconsArr(attr)).toEqual(['by', 'nc', 'sa'])
+    })
+    test('CC BY ND', () => {
+        const attr = { BY: true, ND: true }
+        expect(licenseIconsArr(attr)).toEqual(['by', 'nd'])
+    })
+    test('CC BY NC ND', () => {
+        const attr = { BY: true, NC: true, ND: true }
+        expect(licenseIconsArr(attr)).toEqual(['by', 'nc', 'nd'])
+    })
+})
+
+describe('license url', () => {
+    Object.values(LICENSES).forEach((license) => {
+        const { ATTRIBUTES: attr, URL: url } = license
+        it(`${JSON.stringify(attr)} should return ${url}`, () => {
+            expect(licenseUrl(attr)).toEqual(url)
+        })
+        it(`${JSON.stringify(attr)} for web should return ${url} with a ref value`, () => {
+            const [urlForWeb, ref] = licenseUrl(attr, 'web').split('/?')
+            expect(urlForWeb).toEqual(url)
+            expect(ref).toEqual('ref=chooser-v1')
+        })
+    })
+})
+
+describe('updateVisibleEnabledStatus', function testUpdateVisibleEnabledStatus() {
+    test('empty object', () => {
+        const attr = {}
+        expect(updateVisibleEnabledStatus(attr)).toEqual({
+            enabled: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD'],
+            stepsDisabledDue: '',
+            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD']
+        })
+    })
+    test('FS: true, BY: false', () => {
+        const attr = { FS: true, BY: false }
+        expect(updateVisibleEnabledStatus(attr)).toEqual({
+            enabled: ['FS', 'DD', 'CW', 'AD'],
+            stepsDisabledDue: 'CC0',
+            visible: ['FS', 'DD', 'CW', 'AD']
+        })
+    })
+    test('FS: true, BY: true ', () => {
+        const attr = { FS: true, BY: true }
+        expect(updateVisibleEnabledStatus(attr)).toEqual({
+            enabled: ['FS', 'DD', 'AD'],
+            stepsDisabledDue: '',
+            visible: ['FS', 'DD', 'AD']
+        })
+    })
+    test('FS: false, BY: false', () => {
+        const attr = { FS: false, BY: false }
+        expect(updateVisibleEnabledStatus(attr)).toEqual({
+            enabled: ['FS', 'BY', 'CW', 'AD'],
+            stepsDisabledDue: 'CC0',
+            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'CW', 'AD']
+        })
+    })
+    test('FS: false, BY: true, ND: true', () => {
+        const attr = { FS: false, BY: true, ND: true }
+        expect(updateVisibleEnabledStatus(attr)).toEqual({
+            enabled: ['FS', 'BY', 'NC', 'ND', 'AD'],
+            stepsDisabledDue: 'CC0',
+            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD']
+        })
+    })
+    test('FS: false, BY: true, ND: false', () => {
+        const attr = { FS: false, BY: true, ND: false }
+        expect(updateVisibleEnabledStatus(attr)).toEqual({
+            enabled: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD'],
+            stepsDisabledDue: '',
+            visible: ['FS', 'BY', 'NC', 'ND', 'SA', 'AD']
+        })
+    })
+})
+
+describe('generateHTML', function testGenerateHTML() {
+    const TEST_DATA = {
+        CREATOR: 'John',
+        WORK_TITLE: 'Foo',
+        PROFILE_URL: 'www.john.com',
+        WORK_URL: 'www.john.com/foo.jpg'
+    }
+    // For each kind of Attribution data present, check:
+    // 1. Correct namespaces of RDFa data a applied
+    // 2. License link has correct rel and href attributes
+    // 3. License link has correct text
+    // 4. There are corresponding icons for the license
+    // 5. Creator text and link are correct, and have proper metadata
+    // 6. Work text and link are correct, and have proper metadata
+    const hasIconSourcesErrors = (sources, licenses) => {
+        const urlRef = '?ref=chooser-v1" target="_blank" rel="noopener noreferrer"'
+        if (sources.length !== licenses.length) {
+            return `Incorrect number of licenses, expected ${licenses.length}, got ${sources.length}`
+        }
+        sources.forEach((source) => {
+            if (!source.startsWith(urlRef)) {
+                return `${source} doesn't start with correct base`
+            }
+            const license = source
+                .replace(ICON_BASE_URL, '')
+                .replace(urlRef, '')
+                .replace('.svg', '')
+            if (!licenses.includes(license)) {
+                return `${license} is not supposed to be present`
+            }
+        })
+        return false
+    }
+
+    const attributionOptions = {
+        blank: {},
+        onlyCreator: { creatorName: TEST_DATA.CREATOR },
+        onlyWork: { workTitle: TEST_DATA.WORK_TITLE },
+        onlyCreatorUrl: { creatorProfileUrl: TEST_DATA.PROFILE_URL },
+        onlyWorkUrl: { workUrl: TEST_DATA.WORK_URL },
+        allData: {
+            creatorName: TEST_DATA.CREATOR,
+            workUrl: TEST_DATA.WORK_URL,
+            workTitle: TEST_DATA.WORK_TITLE,
+            creatorProfileUrl: TEST_DATA.PROFILE_URL
+        }
+    }
+    Object.keys(attributionOptions).forEach((option) => {
+        describe(`${option} with CC0 license should return correct HTML`, () => {
+            const currentLicense = LICENSES.CC0
+            const currentAttributionOptions = attributionOptions[option]
+            const generatedHtml = generateHTML(currentAttributionOptions, currentLicense.SHORT)
+            const wrapper = mount(TestComponent, { propsData: { attribution: generatedHtml } })
+            const expectedWorkTitle = currentAttributionOptions.workTitle || ''
+            const expectedCreatorName = currentAttributionOptions.creatorName || ''
+            const expectedWorkUrl = currentAttributionOptions.workUrl || ''
+            const expectedCreatorProfileUrl = currentAttributionOptions.creatorProfileUrl || ''
+
+            it('has correct wrapper', () => {
+                const para = wrapper.find('.html-string > p')
+                expect(Object.keys(para.attributes()).length).toEqual(3)
+                expect(para.attributes()[CC_NAMESPACE.NAME]).toEqual(CC_NAMESPACE.URI)
+                expect(para.attributes()[DCT_NAMESPACE.NAME]).toEqual(DCT_NAMESPACE.URI)
+            })
+            it(`has correct license link ${currentLicense.SHORT} and license icons `, () => {
+                Object.values(LICENSES).forEach((license) => {
+                    const licenseLinkElement = wrapper.find('.license-link').find('a')
+                    const licenseImages = (wrapper) => wrapper.findAll('img')
+
+                    expect(licenseLinkElement.attributes('rel')).toBe('license')
+                    expect(licenseLinkElement.attributes('href')).toBe(currentLicense.URL)
+                    expect(licenseLinkElement.text()).toBe(currentLicense.SHORT)
+
+                    expect(licenseImages(wrapper).at(0).attributes().style).toBe(ICON_STYLE)
+                    const iconSources = licenseImages(wrapper).wrappers.map(img => img.attributes().src)
+                    expect(hasIconSourcesErrors(iconSources, currentLicense.ICONS)).toBe(false)
+                })
+            })
+            it(`has correct work attribution: "${expectedWorkTitle}" at url "${expectedWorkUrl}"`, () => {
+                const workTitle = wrapper.find('.work-title')
+                if (!expectedWorkTitle) {
+                    expect(workTitle.text()).toBeFalsy()
+                } else {
+                    expect(workTitle.text()).toBe(expectedWorkTitle)
+                    if (!expectedWorkUrl) {
+                        const titleMetaAttribute = workTitle.find('span').attributes().property
+                        expect(titleMetaAttribute).toEqual('dct:title')
+                    } else {
+                        const titleLink = workTitle.find('a')
+                        expect(titleLink.attributes().rel).toEqual('cc:attributionURL')
+                        expect(titleLink.attributes().property).toEqual('dct:title')
+                        expect(titleLink.attributes().href).toEqual(`http://${expectedWorkUrl}`)
+                    }
+                }
+            })
+            it(`has correct creator attribution: "${expectedCreatorName}" at url "${expectedCreatorProfileUrl}"`, () => {
+                const creator = wrapper.find('.creator')
+                expect(creator.text()).toBe(expectedCreatorName)
+                if (expectedCreatorName) {
+                    if (expectedCreatorProfileUrl) {
+                        const creatorLinkAttributes = creator.find('a').attributes()
+                        expect(creatorLinkAttributes.rel).toEqual('cc:attributionURL dct:creator')
+                        expect(creatorLinkAttributes.property).toEqual('cc:attributionName')
+                        expect(creatorLinkAttributes.href).toEqual(`http://${expectedCreatorProfileUrl}`)
+                    } else {
+                        expect(creator.find('span').attributes().property).toEqual('cc:attributionName')
+                    }
+                } else {
+                    expect(creator.find('span').exists()).toBeFalsy()
+                    expect(creator.find('a').exists()).toBeFalsy()
+                }
+            })
+        })
+    })
+})