const code = `
!(function () {
  "use strict"
  const assert = $$assert
  function createElement(tag) {
    const ele = document.createElement(tag.tagName)
    if (tag.attributes) {
      Object
        .keys(tag.attributes)
        .forEach(key => ele[key] = tag.attributes[key])
    }
    if (tag.innerHTML) {
      ele.innerHTML = tag.innerHTML
    }
    ele.async = false
    ele.defer = false
    return ele
  }
  function appendTag(tag) {
    document.body.appendChild(createElement(tag))
  }
  function inlineTag(tag, innerHTML) {
    let path
    if (tag.tagName.toUpperCase() === 'LINK') {
      tag.tagName = 'style'
      path = tag.attributes.href
      delete tag.attributes
    } else {
      path = tag.attributes.src
      delete tag.attributes.src
      tag.attributes.async = false
    }
    tag.innerHTML = \\`// From CacheStorage: \\${path} \\\\n\\${innerHTML}\\`
    return tag
  }
  const cacheName = 'assert'
  try {
    window.caches
      .open(cacheName)
      .then((cache) => {
        return assert.map((tag) => {
          if (tag.innerHTML) {
            return tag
          }
          if (!tag.attributes.src && !tag.attributes.href) {
            throw new Error(\\`tag.innerHTML 与 tag.attributes.src、tag.attributes.href 必传一个, 当前为 \\${JSON.stringify(tag)}\\`)
          }
          const assertURL = tag.tagName.toUpperCase() === 'SCRIPT' ? tag.attributes.src : tag.attributes.href
          return cache.match(assertURL)
            .then((response) => {
              if (!response) {
                return cache
                  .add(assertURL)
                  .then(
                    () => cache
                      .match(assertURL)
                      .then(response => response.text())
                      .then(innerHTML => inlineTag(tag, innerHTML))
                  )
              } else {
                console.info(\\`From CacheStorage: \\${assertURL}\\`)
                return response.text().then(innerHTML => inlineTag(tag, innerHTML))
              }
            })
        })
      })
      .then((scriptList) => {
        // Ensure the order of execution
        scriptList
          .reduce(
            (a, b) =>
              a
                .then(appendTag)
                .then(() => b)
          )
          .then(appendTag)
      })
  } catch (e) {
    console.error(e)
    setTimeout(() => {
      if (window.fundebug) {
        fundebug.notifyError(e)
      }
    }, 3000)
    const fragment = document.createDocumentFragment()
    assert.map(tag => {
      const ele = createElement(tag)
      fragment.appendChild(ele)
    })
    document.body.appendChild(fragment)
  }
})();
`

const compiler = source =>
  require('@babel/core').transformSync(
    source,
    {
      presets: [ '@babel/preset-env' ]
    }
  )
    .code

class CacheStaticPlugin {
  constructor(htmlWebpackPlugin, test) {
    this.htmlWebpackPlugin = htmlWebpackPlugin
    this.test = test
  }
  isTargetTag(tag) {
    let link
    const result = (tag.tagName === 'script' || tag.tagName === 'link')
      && !tag.innerHTML
      && tag.attributes
      && (link = (tag.attributes.src || tag.attributes.href))
      && (this.test instanceof RegExp ? this.test.test(link) : this.test(link))
    if (!result) {
    }
    return !!result
  }
  injectCacheStaticCode(scriptList) {
    return compiler(code.replace('$$assert', JSON.stringify(scriptList)))
  }
  apply(compiler) {
    compiler.hooks.compilation.tap('StaticCachePlugin', compilation => {
      const hooks = this.htmlWebpackPlugin.getHooks(compilation)
      hooks.alterAssetTagGroups.tap('StaticCachePlugin', assets => {
        assets.bodyTags = [
          ...assets.bodyTags.filter(tag => !this.isTargetTag(tag)),
          {
            tagName: 'script',
            innerHTML: this.injectCacheStaticCode(assets.bodyTags.filter(this.isTargetTag.bind(this))),
            closeTag: true
          }
        ]
      })
    })
  }
}

module.exports = CacheStaticPlugin

// cache
const OFFLINE_SUFFIX = '?offline';

let CURRENT_CACHES = {
  offline: 'offline'
};

const cacheFiles = [
  '/?offline'
];

self.addEventListener('install', function(event) {
  event.waitUntil(self.skipWaiting());
  event.waitUntil(
    caches.open(CURRENT_CACHES.offline).then(cache => {
      return cache.addAll(cacheFiles);
    })
  );
});

const matchCache = async function(event, caches) {
  const res = await Promise.all([
    caches.match(event.request.url + OFFLINE_SUFFIX),
    caches.match(event.request.url)
  ]);
  if (res.some(e => e)) {
    return res.filter(e => {
      if (e) return e;
    })[0];
  } else {
    return new Response();
  }
};

const matchOfflineUrl = function(origin, event) {
  if (event.request.method !== 'GET') {
    return false;
  }
  return (
    cacheFiles.some(url => origin + url === event.request.url) ||
    cacheFiles.some(url => origin + url === event.request.url + OFFLINE_SUFFIX)
  );
};

self.addEventListener('fetch', function(event) {
  const origin = location.origin;
  if (matchOfflineUrl(origin, event)) {
    event.respondWith(
      fetch(event.request.url)
        .then(response => {
          if (!response.ok) {
            return caches.open(CURRENT_CACHES.offline).then(cache => {
              event.request.url === origin + '/' && cache.add(cacheFiles[0]);
              cache.put(event.request, response.clone());
              return response;
            });
          } else {
            return matchCache(event, caches).then(r => r);
          }
        })
        .catch(err => {
          console.error(err);
          return matchCache(event, caches).then(r => r);
        })
    );
  }
});