Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Removal preload tags #131

Merged
merged 4 commits into from
May 3, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -124,12 +124,13 @@ This library ...
- original url comes from canonical's href attribute
- e.g. `<a href="/test">` is replaced with `<a href="https//original-url.com/test">`
- NOTE: If the canonical url in your html is not absolute url this function would be passed
- remove all `<link ref="preload" type="script">`, `<link ref="preload" type="fetch">`
- optimize html by using [@ampproject/toolbox-optimizer](https://github.com/ampproject/amp-toolbox/tree/master/packages/optimizer)

## Preparation

To make your html valid AMP your html also should ...

- have canonical meta tag to regular HTML
- not have any problem if all scripts are removed
- not have any problem if all `!imporant` syntax are removed in css
- Don't have any problem if all scripts are removed
- Don't have any problem if all `!imporant` syntax are removed in css
4 changes: 3 additions & 1 deletion index.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,8 @@ const ga = require('./lib/googleanalytics')
const iframe = require('./lib/iframe')
const boilerplate = require('./lib/boilerplate')
const serviceworker = require('./lib/serviceWorker')
const link = require('./lib/link')
const link = require('./lib/link/canonical')
const preload = require('./lib/link/preload')
const toolbox = require('./lib/toolbox')
const html = require('./lib/html')

Expand All @@ -27,6 +28,7 @@ const html2amp = async (htmlString, options = {}) => {
$ = ga($, options)
$ = iframe($, options)
$ = link($)
$ = preload($)
$ = serviceworker($, options)
$ = boilerplate($, options)
htmlString = html($, options)
Expand Down
4 changes: 2 additions & 2 deletions lib/link.js → lib/link/canonical.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@ const replaceOriginal = ($, elems, url) => {
})
}

const link = ($) => {
const canonical = ($) => {
const canonicalUrl = $('link[rel=canonical]').attr('href')
if (!canonicalUrl) return $
replaceOriginal($, $('a[href]'), canonicalUrl)
return $
}

module.exports = link
module.exports = canonical
7 changes: 7 additions & 0 deletions lib/link/preload.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
const preload = ($) => {
$('link[rel="preload"][as="script"]').remove()
$('link[rel="preload"][as="fetch"]').remove()
return $
}

module.exports = preload
20 changes: 10 additions & 10 deletions test/link.test.js → test/link/canonical.test.js
Original file line number Diff line number Diff line change
@@ -1,55 +1,55 @@
const cheerio = require('cheerio')
const assert = require('./assert')
const link = require('../lib/link')
const htmlFactory = require('./html')
const assert = require('../assert')
const canonical = require('../../lib/link/canonical')
const htmlFactory = require('../html')

describe('link', function () {
describe('canonical', function () {
const head = '<link rel="canonical" href="https://example.com/test/article/">'

describe('if there is a link which href starts with /', function () {
const html = htmlFactory({ head, body: '<a href="/test"></a>' })
it('should be replaced with origin in canonical', function () {
const $ = link(cheerio.load(html))
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head, body: '<a href="https://example.com/test"></a>' }))
})
})

describe('if there is a link which href starts with ./test', function () {
const html = htmlFactory({ head, body: '<a href="./bar"></a>' })
it('should be replaced with origin in canonical', function () {
const $ = link(cheerio.load(html))
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head, body: '<a href="https://example.com/test/article/bar"></a>' }))
})
})

describe('if there is a link which href starts with ../test', function () {
const html = htmlFactory({ head, body: '<a href="../test"></a>' })
it('should be replaced with origin in canonical', function () {
const $ = link(cheerio.load(html))
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head, body: '<a href="https://example.com/test/test"></a>' }))
})
})

describe('if there is a link which href starts with `test`', function () {
const html = htmlFactory({ head, body: '<a href="test"></a>' })
it('should be replaced with origin in canonical', function () {
const $ = link(cheerio.load(html))
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head, body: '<a href="https://example.com/test/article/test"></a>' }))
})
})

describe('if there is a link which href starts with http', function () {
const html = htmlFactory({ head, body: '<a href="https://example.com"></a>' })
it('should be replaced with origin in canonical', function () {
const $ = link(cheerio.load(html))
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head, body: '<a href="https://example.com"></a>' }))
})
})

describe('if there is a link which href starts with //', function () {
const html = htmlFactory({ head, body: '<a href="//example.com"></a>' })
it('should be replaced with origin in canonical', function () {
const $ = link(cheerio.load(html))
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head, body: '<a href="//example.com"></a>' }))
})
})
Expand Down
28 changes: 28 additions & 0 deletions test/link/preload.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
const cheerio = require('cheerio')
const assert = require('../assert')
const canonical = require('../../lib/link/preload')
const htmlFactory = require('../html')

describe('preload', function () {
describe('If there is link tag for preloading script', function () {
const html = htmlFactory({ head: '<link rel="preload" as="script" href="https://example.com/test.js">' })
it('should be removed', function () {
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head: '' }))
})
})
describe('If there is link tag for preloading fetch resource', function () {
const html = htmlFactory({ head: '<link rel="preload" as="fetch" href="https://example.com/test.json">' })
it('should be removed', function () {
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head: '' }))
})
})
describe('If there is link tag for preloading style', function () {
const html = htmlFactory({ head: '<link rel="preload" as="style" href="https://example.com/test.css">' })
it('shouldn\'t be removed', function () {
const $ = canonical(cheerio.load(html))
assert($, htmlFactory({ head: '<link rel="preload" as="style" href="https://example.com/test.css">' }))
})
})
})