fix(logo): avoid data uri with no length

Since logo can be detected from HTML markup there is the case where the data URI detected is empty. an empty data uri ('data:,') is considered a valid URL & URI, but can't be considered a valid image.

package.json

@@ -175,7 +175,12 @@
   "commitlint": {
     "extends": [
       "@commitlint/config-conventional"
-    ]
+    ],
+    "rules": {
+      "body-max-length": [
+        0
+      ]
+    }
   },
   "nano-staged": {
     "*.js": [

packages/metascraper-helpers/index.js

@@ -11,6 +11,7 @@ const _normalizeUrl = require('normalize-url')
 const smartquotes = require('smartquotes')
 const { decodeHTML } = require('entities')
 const iso6393 = require('iso-639-3/to-1')
+const dataUri = require('data-uri-utils')
 const hasValues = require('has-values')
 const chrono = require('chrono-node')
 const isIso = require('isostring')
@@ -375,11 +376,17 @@ const $jsonld = propName => $ => {
 
 const image = (value, opts) => {
   const urlValue = url(value, opts)
-  return urlValue !== undefined &&
+
+  const result =
+    urlValue !== undefined &&
     !isAudioUrl(urlValue, opts) &&
     !isVideoUrl(urlValue, opts)
-    ? urlValue
-    : undefined
+      ? urlValue
+      : undefined
+
+  if (!dataUri.test(result)) return result
+  const buffer = dataUri.toBuffer(dataUri.normalize(result))
+  return buffer.length ? result : undefined
 }
 
 const logo = image

packages/metascraper-helpers/package.json

@@ -25,6 +25,7 @@
     "audio-extensions": "0.0.0",
     "chrono-node": "~2.7.4",
     "condense-whitespace": "~2.0.0",
+    "data-uri-utils": "~1.0.7",
     "entities": "~4.5.0",
     "file-extension": "~4.0.5",
     "has-values": "~2.0.1",

packages/metascraper-helpers/test/index.js

@@ -248,6 +248,7 @@ test('.image', t => {
     image({ '@id': 'https://www.milanocittastato.it/#/schema/logo/image/' }),
     undefined
   )
+  t.is(image('data:,'), undefined)
 })
 
 test('.isImageUrl', t => {

packages/metascraper-logo-favicon/src/index.js

@@ -9,12 +9,12 @@ const {
   parseUrl,
   normalizeUrl,
   toRule,
-  url: urlFn
+  logo: logoFn
 } = require('@metascraper/helpers')
 
 const SIZE_REGEX_BY_X = /\d+x\d+/
 
-const toUrl = toRule(urlFn)
+const toLogo = toRule(logoFn)
 
 const toSize = (input, url) => {
   if (isEmpty(input)) return
@@ -170,7 +170,7 @@ module.exports = ({
   const rootFavicon = createRootFavicon({ getLogo, withRootFavicon })
   return {
     logo: [
-      toUrl($ => {
+      toLogo($ => {
         const sizes = getSizes($, sizeSelectors)
         const size = pickFn(sizes, pickBiggerSize)
         return get(size, 'url')

packages/metascraper-logo-favicon/test/index.js

@@ -237,3 +237,11 @@ test('resolve logo using from google associated with the domain', async t => {
   const metadata = await metascraper({ url })
   t.true(metadata.logo.includes('gstatic'))
 })
+
+test('avoid data URI when data length is 0', async t => {
+  const url = 'https://www.adobe.com/'
+  const html = '<link rel="icon" href="data:,">'
+  const metascraper = createMetascraper()
+  const metadata = await metascraper({ url, html })
+  t.is(metadata.logo, 'https://www.adobe.com/favicon.ico')
+})

packages/metascraper-logo/src/index.js

@@ -1,6 +1,6 @@
 'use strict'
 
-const { $jsonld, url: urlFn, toRule } = require('@metascraper/helpers')
+const { $jsonld, logo: logoFn, toRule } = require('@metascraper/helpers')
 const { eq, get } = require('lodash')
 
 const toLogoUrl = ($, propName) => {
@@ -13,26 +13,26 @@ const toLogoUrl = ($, propName) => {
 module.exports = ({ filter } = {}) => {
   const mapper = filter
     ? async value => {
-      const result = urlFn(value)
+      const result = logoFn(value)
       return typeof result === 'string' ? await filter(result) : result
     }
-    : urlFn
+    : logoFn
 
-  const toUrl = toRule(mapper)
+  const toLogo = toRule(mapper)
 
   return {
     logo: [
-      toUrl($ => $('meta[property="og:logo"]').attr('content')),
-      toUrl($ => $('meta[itemprop="logo"]').attr('content')),
-      toUrl($ => $('img[itemprop="logo"]').attr('src')),
-      toUrl($ => toLogoUrl($, 'brand.logo')),
-      toUrl($ => toLogoUrl($, 'organization.logo')),
-      toUrl($ => toLogoUrl($, 'place.logo')),
-      toUrl($ => toLogoUrl($, 'product.logo')),
-      toUrl($ => toLogoUrl($, 'service.logo')),
-      toUrl($ => toLogoUrl($, 'publisher.logo')),
-      toUrl($ => toLogoUrl($, 'logo.url')),
-      toUrl($ => toLogoUrl($, 'logo'))
+      toLogo($ => $('meta[property="og:logo"]').attr('content')),
+      toLogo($ => $('meta[itemprop="logo"]').attr('content')),
+      toLogo($ => $('img[itemprop="logo"]').attr('src')),
+      toLogo($ => toLogoUrl($, 'brand.logo')),
+      toLogo($ => toLogoUrl($, 'organization.logo')),
+      toLogo($ => toLogoUrl($, 'place.logo')),
+      toLogo($ => toLogoUrl($, 'product.logo')),
+      toLogo($ => toLogoUrl($, 'service.logo')),
+      toLogo($ => toLogoUrl($, 'publisher.logo')),
+      toLogo($ => toLogoUrl($, 'logo.url')),
+      toLogo($ => toLogoUrl($, 'logo'))
     ]
   }
 }

packages/metascraper-telegram/src/index.js

@@ -4,6 +4,7 @@ const {
   author,
   date,
   image,
+  logo,
   memoizeOne,
   parseUrl,
   sanetizeUrl,
@@ -17,6 +18,7 @@ const got = require('got')
 
 const toAuthor = toRule(author)
 const toImage = toRule(image)
+const toLogo = toRule(logo)
 const toDate = toRule(date)
 
 const TELEGRAM_DOMAINS = ['telegram.me', 't.me']
@@ -48,7 +50,7 @@ module.exports = ({ gotOpts, keyvOpts } = {}) => {
 
   const rules = {
     author: [toAuthor($ => $('meta[property="og:title"]').attr('content'))],
-    logo: [toImage($ => $('meta[property="og:image"]').attr('content'))],
+    logo: [toLogo($ => $('meta[property="og:image"]').attr('content'))],
     image: [
       toImage(
         loadIframe(($iframe, url) => {