https://github.com/morbidick/serviceworker-helpers

Display a toast on available service worker update
https://github.com/morbidick/serviceworker-helpers

polymer-element polymer2 service-worker web-components

Last synced: 11 months ago
JSON representation

Display a toast on available service worker update

• Host: GitHub
• URL: https://github.com/morbidick/serviceworker-helpers
• Owner: morbidick
• Created: 2017-08-31T11:43:10.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2018-08-09T15:55:57.000Z (almost 8 years ago)
• Last Synced: 2025-04-07T09:01:33.754Z (about 1 year ago)
• Topics: polymer-element, polymer2, service-worker, web-components
• Language: HTML
• Homepage:
• Size: 23.4 KB
• Stars: 9
• Watchers: 2
• Forks: 1
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Polymer 2 components to work with Service Workers

[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/morbidick/serviceworker-helpers)

[![Build Status](https://travis-ci.org/morbidick/serviceworker-helpers.svg?branch=master)](https://travis-ci.org/morbidick/serviceworker-helpers)

## HowTo

### Register service worker

Since its more or less a one-liner to register your service worker and included in most boilerplates there is no specific element.

```html

  if ('serviceWorker' in navigator) {

    window.addEventListener('load', function() {

      navigator.serviceWorker.register('/service-worker.js');

    });

  }

```

### \

Displays a toast requesting the user to reload the page when a source code update is available.

The update message can be overwriten by setting `message` (optional). The display time can be changed by setting `duration`, defaults to 0 / persistend.

```html

```

Change the link color by setting the css var `--primary-color`.

## Development

```bash

# Get dependencies

$ npm install

# Demo site

$ npm start

# Run tests

$ npm test

```