Merge Develop (#120) | manifest_v3

* Add alternative startpage routes

* Enable owa disabling

* Deactivate isEnabled when deleting user data

* Manifest v3 (#113)

* Update manifest.json to v3

* Remove unused external fontawesome ressource

* Replace deprecated methods

* Divide and fix web accessable ressources

* Remove useless leftover files?

* Use async chrome API in background.ts

* Use async chrome API in credentials.ts

* Use async chrome API in owaFetch.ts

* Use async chrome API for searchEngines/common

* Use async chrome API for login/common

* Use async chrome API for other/opal

* Hisqis pimped table by default

* Use async chrome API for other/hisqis

* Use async chrome API for vue chrome definitions

* Remove leftover strings

* Remove background.html (not used anymore)

* Rewrite opal inline to use declarativeNetRequest

* Stops scrollbar from appearing unnecessarily and reserves space for it.

The scrollbar appeared when you clicked one of the setting tiles, since

the design element in the background caused the container to overflow. Setting

the overflow to hidden while the card is open, fixes this issue.

The relatively new and handy css property "scrollbar-gutter: stable" is also

added, that reserves the needed space for the scrollbar, meaning that there is

no layout shift when it appears and disappears.

* Ask for new permissions

* Change settings text for opal inline stuff

* Well that didn't work...

* Userdata safer now

* It's a race condition after all...

* Fix chrome composables

* Firefox support MV3

* Bump version

* Mini cleanup

* npm audit fix

* Apply v3 changes to FF fix

* npm run (useChrome|useFF)

* fix path for useFF useChrome

* Changed name of action shortcut (MV3 change)

* Update CONTRIBUTING.md

* Delete codesee-arch-diagram.yml

* update release action

* Fix opal inline migration and settings opening

* Await stuff

* Add new opal banner

* Add manifest.json to gitignore

* Make text more clear and await

* Add startpage alternative route to manifest (again?)

* manifest default is Chrome

* Better legacy user identification

* Simplify update banner logic

* Delete manifest.json

* change banner text to fit on one line

* Fix mv3 banner

* Help wanted banner after 100 clicks

* increase version number

* fix typo

* optimize release action

* update readmes

---------

Co-authored-by: Noxdor <[email protected]>
Co-authored-by: Oli <[email protected]>

* change test script

* remove on-pr workflow

* added gh workflow

---------

Co-authored-by: Daniel Kluge <[email protected]>
Co-authored-by: Daniel <[email protected]>
Co-authored-by: Noxdor <[email protected]>

.github/workflows/release.yml

@@ -30,12 +30,17 @@ jobs:
       # Runs a single command using the runners shell
       - run: npm ci
       #- run: npm run test
+      - run: npm run useChrome
       - run: npm run build
-      - run: cd build && zip -r ../TUfast_TUD.zip *
+      - run: zip -r ../TUfast_TUD_chrome.zip build/*
+
+      - run: npm run useFF
+      - run: npm run build
+      - run: zip -r ../TUfast_TUD_firefox.zip build/*
 
       - uses: ncipollo/release-action@v1
         with:
-          artifacts: "TUfast_TUD.zip"
+          artifacts: "TUfast_TUD_chrome.zip,TUfast_TUD_firefox.zip"
           token: ${{ secrets.GITHUB_TOKEN }}
           tag: ${{ github.event.inputs.version }}
           body: ${{ github.event.inputs.description }}

.gitignore

@@ -2,3 +2,4 @@ build/
 node_modules/
 .vscode/
 *.zip
+src/manifest.json

CONTRIBUTING.md

@@ -1,47 +1,39 @@
 # Contributing
 
-Wir sammeln Aufgaben im [Project-Board](https://github.com/orgs/TUfast-TUD/projects/1). Alternativ kannst du auch eigene Features Vorschlagen - wir freuen uns über kreative Ideen! **Achtung**: Das Project-board ist nicht immer aktuell.
+- before implementing a feature communicate with us via [Matrix](https://matrix.to/#/#tu-fast:tu-dresden.de) or GitHub
+- commit any feature containing pull requests against the develop-branch
+- commit any hot-fixes against main-branch
 
-**Bitte sprich mit uns ab, bevor du neue Features implementierst**. Wir kommunizieren über einen [Matrix-Space](https://matrix.to/#/#tu-fast:tu-dresden.de). Dort kannst du dich über dein TU-Login anmelden.
 
-## Getting started
+## Working with this repo
 
-#### Developing browser extensions
+Everything related to the browser extension can be found in `/src`: `manifest.json`, background-script (`background.js`) and so on. Content scripts are in `/src/contentScripts`. In `/src/freshContent` you can find newly created content that is used in TUfast, e.g. the popup or settings-page.
 
-If you never worked with browser extensions before, you should read this very [nice tutorial](https://developer.chrome.com/docs/extensions/mv2/getstarted/). Currently we are still using manifest v2, but we plan to switch to v3 in proximate future. Alternatively you can use the instructions from [mozilla](https://developer.mozilla.org/de/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension). Make sure you understand the difference between content- and background-scripts, their scopes and how they can exchange information with messaging.
-
-#### Working with this repo
+Steps to contribute:
 
-Everything related to the browser extension can be found in `/src`: `manifest.json`, background-script (`background.js`) and so on. Content scripts are in `/src/contentScripts`. In `/src/freshContent` you can find newly created webcontent that is used in TUfast, e.g. the popup or settings-page.
+1. Create a local clone of this repo `git clone <url-of-your-repo>`
+2. Checkout develop branch `git checkout develop`
+3. Create new feature branch from develop `git checkout -b <my_new_feature_branch>`
+4. Install dependencies `npm ci` - you need node package manager npm installed
+5. Run `npm useChrome` or `npm useFF` to select the browser you are developing for - this will copy the corresponding manifest.json
+6. Run `npm run dev` while developing. This is will compile sass and ts files and watch for changes in your working tree.
+7. Load the ./build directory as an unpacked extension in your browser
+8. Run tests locally before committing code `npm run test`
+9. Create a pull request
+10. Await our review
 
-#### Used frameworks
+**Note:** as a member of TUfast you can work in this repo directly, e.g. you can create branches and push to them, making the contribution process easier.
 
-- Build tool: [Snowpack](https://www.snowpack.dev/) - You need to run `npm run dev` while developing to compile sass and ts files.
+## Used frameworks
+- Build tool: [Snowpack](https://www.snowpack.dev/). Run `npm run dev` to compile sass and ts files.
 - CSS-Preprocessor: We are using [SASS](https://sass-lang.com/).
-- ESlint: We are following standard styling with minor additions. Run `npm run lint` to check your code style before committing code.
-
-#### Known peculiarities with browser extensions
-
-**Error:** `Unchecked runtime.lastError: The message port closed before a response was received.` Promisifying chrome.runtime.sendMessage({...}) doesnt work, because when you define a callback (Promise.resolve) sendMessage will wait until sendResponse is called in the message handler. It just stalls execution and then dies if it's never called. **Solutions:** 1) Unpromisify sendMessage. 2) Always return a value (return true is fine).
+- ESlint: We are following standard styling with minor additions. Run `npm run lint` or `npm run test` to check your code style before committing code.
 
-## How to contribute code (as a non-TUfastTeam-member)
+## Getting started with browser extensions
 
-We are using the standard gitflow-workflow (simple [Tutorial](https://www.atlassian.com/de/git/tutorials/comparing-workflows/gitflow-workflow)).
-
-You can use [GitHub CodeSpaces](https://github.com/features/codespaces) for easy contribution.
-
-Steps to contribute a feature (as a non-TUfast-teammember):
-
-1. Create a fork from this repo.
-2. Create a local clone of your fork `git clone <url-of-your-repo>`
-3. Checkout develop branch `git checkout develop`
-4. Create new feature branch `git checkout -b <my_new_feature_branch>`
-5. Install dependencies `npm ci` (you need node package manager = npm installed)
-6. Run `npm run dev` while developing. This is will compile sass and ts files and watch for changes in your working tree.
-7. Load the ./build directory as an unpacked extension in your browser and --> Implement your Code <--
-8. **run tests locally** before contributing code: `npm run test`
-9. Create a PR on develop branch
+If you never worked with browser extensions before, you should read this very [nice tutorial](https://developer.chrome.com/docs/extensions/mv2/getstarted/). Currently we are still using manifest v2, but we plan to switch to v3 in proximate future. Alternatively you can use the instructions from [mozilla](https://developer.mozilla.org/de/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension). Make sure you understand the difference between content- and background-scripts, their scopes and how they can exchange information with messaging.
 
-**Note:** as a member of the TUfast-Team you can work in this repo directly, e.g. you can create branches and push to them, making the contribution process easier.
+### Known peculiarities with browser extensions
+**Error:** `Unchecked runtime.lastError: The message port closed before a response was received.` Promisifying chrome.runtime.sendMessage({...}) doesnt work, because when you define a callback (Promise.resolve) sendMessage will wait until sendResponse is called in the message handler. It just stalls execution and then dies if it's never called. **Solutions:** 1) Unpromisify sendMessage. 2) Always return a value (return true is fine).
 
-#### Have fun developing! 🔥
+## Have fun developing! 🔥

README.md

@@ -28,11 +28,7 @@ Siehe auch [Datenschutzerklärung](https://tu-fast.de/datenschutz).
 Danke an alle [Contributor](https://github.com/TUfast-TUD/TUfast_TUD/graphs/contributors) und Unterstützer. Das ist großartige Arbeit für die Studierenden und die TU Dresden! [Hier](https://www.buymeacoffee.com/olihausdoerfer) kannst du das Entwicklerteam mit einem kleinen Snack unterstützen.
 
 ## Zum Projekt beitragen (Contributing)
-- before implementing a feature communicate with us via [Matrix](https://matrix.to/#/#tu-fast:tu-dresden.de) or GitHub
-- we use automated code-checking via GitHub Action. Please use `npm run test` locally and fix any linting before pushing
-- commit any feature containting pull requests against the develop-branch
-- commit any hotfixes against main-branch
-- consult [CONTRIBUTING.md](https://github.com/TUfast-TUD/TUfast_TUD/blob/main/CONTRIBUTING.md) for further information
+Consult [CONTRIBUTING.md](https://github.com/TUfast-TUD/TUfast_TUD/blob/main/CONTRIBUTING.md) for information.
 
 ## Roadmap
 Wir entwickeln stetig an TUfast, um es noch besser und für mehr Studierende verfügbar zu machen. Das Projekt wird im [Projekt-Board](https://github.com/orgs/TUfast-TUD/projects/1) organisiert.

package.json

@@ -5,9 +5,11 @@
   "main": "index.js",
   "scripts": {
     "lint": "npx eslint --ext .js,.ts,.vue --fix .",
-    "test": "npm run lint && npm run build",
+    "test": "npm run lint && npm run useChrome && npm run build",
     "dev": "snowpack build --watch",
-    "build": "snowpack build"
+    "build": "snowpack build",
+    "useChrome": "cp src/manifest.chrome.json src/manifest.json",
+    "useFF": "cp src/manifest.firefox.json src/manifest.json"
   },
   "repository": {
     "type": "git",

src/background.html

@@ -1 +1,7 @@
-<script type="module" src="background.js"></script>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <script type="module" src="background.js"></script>
+  </head>
+</html>