Add USE_SERVICE_WORKER setting (#9110)

* Add USE_SERVICE_WORKER setting

This will be very useful setting for anyone doing frontend work.

Fixes: https://github.com/go-gitea/gitea/issues/9044
* prevent potential syntax error on old browsers

diff --git a/custom/conf/app.ini.sample b/custom/conf/app.ini.sample
index 53488dfd477eee6bf4a3bdf6858cb41e4edb2bae..aa580e6a55b65998aa384fb9fb4eff0a41470848 100644 (file)
--- a/custom/conf/app.ini.sample
+++ b/custom/conf/app.ini.sample
@@ -153,6 +153,8 @@ THEMES = gitea,arc-green
 DEFAULT_SHOW_FULL_NAME = false
 ; Whether to search within description at repository search on explore page.
 SEARCH_REPO_DESCRIPTION = true
+; Whether to enable a Service Worker to cache frontend assets
+USE_SERVICE_WORKER = true
 
 [ui.admin]
 ; Number of users that are displayed on one page

diff --git a/docs/content/doc/advanced/config-cheat-sheet.en-us.md b/docs/content/doc/advanced/config-cheat-sheet.en-us.md
index 11c0686c512e01f47d8dee2543195706f8ffaabf..9fdcd2c82bbdf45fa41cbd43258cbced9e46c24d 100644 (file)
--- a/docs/content/doc/advanced/config-cheat-sheet.en-us.md
+++ b/docs/content/doc/advanced/config-cheat-sheet.en-us.md
@@ -118,8 +118,9 @@ Values containing `#` or `;` must be quoted using `` ` `` or `"""`.
 - `DEFAULT_THEME`: **gitea**: \[gitea, arc-green\]: Set the default theme for the Gitea install.
 - `THEMES`:  **gitea,arc-green**: All available themes. Allow users select personalized themes
   regardless of the value of `DEFAULT_THEME`.
-- `DEFAULT_SHOW_FULL_NAME`: false: Whether the full name of the users should be shown where possible. If the full name isn't set, the username will be used.
-- `SEARCH_REPO_DESCRIPTION`: true: Whether to search within description at repository search on explore page.
+- `DEFAULT_SHOW_FULL_NAME`: **false**: Whether the full name of the users should be shown where possible. If the full name isn't set, the username will be used.
+- `SEARCH_REPO_DESCRIPTION`: **true**: Whether to search within description at repository search on explore page.
+- `USE_SERVICE_WORKER`: **true**: Whether to enable a Service Worker to cache frontend assets.
 
 ### UI - Admin (`ui.admin`)
 

diff --git a/docs/content/doc/advanced/hacking-on-gitea.en-us.md b/docs/content/doc/advanced/hacking-on-gitea.en-us.md
index 8c8249c0480e54c49959bbc43de4181c9ca51196..01e2474651e3ab83de1e8a188326ad20f7b7506d 100644 (file)
--- a/docs/content/doc/advanced/hacking-on-gitea.en-us.md
+++ b/docs/content/doc/advanced/hacking-on-gitea.en-us.md
@@ -138,9 +138,9 @@ make revive vet misspell-check
 
 ### Updating CSS
 
-To generate the CSS, you will need [Node.js](https://nodejs.org/) 8.0 or greater with npm. At present we use [less](http://lesscss.org/) and [postcss](https://postcss.org) to generate our CSS. Do **not** edit the files in `public/css` directly, as they are generated from `lessc` from the files in `public/less`.
+To generate the CSS, you need [Node.js](https://nodejs.org/) 8.0 or greater with npm. We use [less](http://lesscss.org/) and [postcss](https://postcss.org) to generate our CSS. Do **not** edit the files in `public/css` directly, as they are generated from `lessc` from the files in `public/less`.
 
-Edit files in `public/less`, run the linter, regenerate the CSS and commit all changed files:
+Edit files in `public/less`, and then run the linter and build the CSS files via:
 
 ```bash
 make css
@@ -148,12 +148,14 @@ make css
 
 ### Updating JS
 
-To run the JavaScript linter you will need [Node.js](https://nodejs.org/) 8.0 or greater with npm. Edit files in `public/js` and run the linter:
+To generate the JS files, you need [Node.js](https://nodejs.org/) 8.0 or greater with npm. Edit files in `public/js`, run the linter and build the JS files via:
 
 ```bash
 make js
 ```
 
+Note: When working on frontend code, it is advisable to set `USE_SERVICE_WORKER` to `false` in `app.ini` which will prevent undesirable caching of frontend assets.
+
 ### Updating the API
 
 When creating new API routes or modifying existing API routes, you **MUST**

diff --git a/modules/setting/setting.go b/modules/setting/setting.go
index dbe64fa3fd8f95de5de741a32c2d4d11e618ae2f..f2112f59f1c1f5399fb726443efbcb4ac1c58a3e 100644 (file)
--- a/modules/setting/setting.go
+++ b/modules/setting/setting.go
@@ -170,6 +170,7 @@ var (
                DefaultTheme          string
                Themes                []string
                SearchRepoDescription bool
+               UseServiceWorker      bool
 
                Admin struct {
                        UserPagingNum   int
@@ -969,6 +970,7 @@ func NewContext() {
        UI.ShowUserEmail = Cfg.Section("ui").Key("SHOW_USER_EMAIL").MustBool(true)
        UI.DefaultShowFullName = Cfg.Section("ui").Key("DEFAULT_SHOW_FULL_NAME").MustBool(false)
        UI.SearchRepoDescription = Cfg.Section("ui").Key("SEARCH_REPO_DESCRIPTION").MustBool(true)
+       UI.UseServiceWorker = Cfg.Section("ui").Key("USE_SERVICE_WORKER").MustBool(true)
 
        HasRobotsTxt = com.IsFile(path.Join(CustomPath, "robots.txt"))
 

diff --git a/modules/templates/helper.go b/modules/templates/helper.go
index 6aa429ee142c40bf598935a68b9a966b0eab9862..8b5497a1c9ac7e543c17acbd8af1a7c3fb9683df 100644 (file)
--- a/modules/templates/helper.go
+++ b/modules/templates/helper.go
@@ -148,6 +148,9 @@ func NewFuncMap() []template.FuncMap {
                "MetaKeywords": func() string {
                        return setting.UI.Meta.Keywords
                },
+               "UseServiceWorker": func() bool {
+                       return setting.UI.UseServiceWorker
+               },
                "FilenameIsImage": func(filename string) bool {
                        mimeType := mime.TypeByExtension(filepath.Ext(filename))
                        return strings.HasPrefix(mimeType, "image/")

diff --git a/templates/base/head.tmpl b/templates/base/head.tmpl
index 32251f84ae73405279c8e32d0e8df93d6addb850..2cc48c632fd2b9958ff6e5fb4c56bf4e4227a084 100644 (file)
--- a/templates/base/head.tmpl
+++ b/templates/base/head.tmpl
@@ -6,22 +6,30 @@
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>{{if .Title}}{{.Title}} - {{end}} {{if .Repository.Name}}{{.Repository.Name}} - {{end}}{{AppName}}</title>
        <link rel="manifest" href="{{AppSubUrl}}/manifest.json" crossorigin="use-credentials">
-
+       {{if UseServiceWorker}}
        <script>
                if ('serviceWorker' in navigator) {
-                       window.addEventListener('load', function() {
-                       navigator.serviceWorker.register('{{AppSubUrl}}/serviceworker.js').then(function(registration) {
-                               // Registration was successful
-                               console.log('ServiceWorker registration successful with scope: ', registration.scope);
-                               }, function(err) {
-                                       // registration failed :(
-                               console.log('ServiceWorker registration failed: ', err);
-                       });
-                       });
+                       navigator.serviceWorker.register('{{AppSubUrl}}/serviceworker.js').then(function(registration) {
+                               // Registration was successful
+                               console.info('ServiceWorker registration successful with scope: ', registration.scope);
+                       }, function(err) {
+                               // registration failed :(
+                               console.info('ServiceWorker registration failed: ', err);
+                       });
                }
-
        </script>
-
+       {{else}}
+       <script>
+               if ('serviceWorker' in navigator) {
+                       navigator.serviceWorker.getRegistrations().then(function(registrations) {
+                               registrations.forEach(function(registration) {
+                                       registration.unregister();
+                                       console.info('ServiceWorker unregistered');
+                               });
+                       });
+               }
+       </script>
+       {{end}}
        <meta name="theme-color" content="{{ThemeColorMetaTag}}">
        <meta name="author" content="{{if .Repository}}{{.Owner.Name}}{{else}}{{MetaAuthor}}{{end}}" />
        <meta name="description" content="{{if .Repository}}{{.Repository.Name}}{{if .Repository.Description}} - {{.Repository.Description}}{{end}}{{else}}{{MetaDescription}}{{end}}" />