From fa7bf4770054e30aa2fb621de5f3e9d537ebd1b8 Mon Sep 17 00:00:00 2001 From: avi12 Date: Mon, 26 Aug 2024 13:30:33 +0300 Subject: [PATCH] Fixed README --- README.md | 145 ++++++++++++++++++++++++------------------------------ 1 file changed, 64 insertions(+), 81 deletions(-) diff --git a/README.md b/README.md index 2182fb2..c93adb0 100644 --- a/README.md +++ b/README.md @@ -22,32 +22,24 @@ Powered by [Plasmo](https://github.com/plasmohq/plasmo) ## Known issue -Due to the way the browsers handle extensions, when an extension receives an update, content scripts in already-open web -pages cannot use the [Storage API](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/storage), -until the user reloads those web pages. -In the context of this extension, it means that when the extension receives an update, as long as the user doesn't -reload YouTube web pages, the extension cannot get the data regarding the user-preferred qualities. +Due to the way the browsers handle extensions, when an extension receives an update, content scripts in previously-open web +pages cannot use the [Storage API](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/storage) until the user reloads them, which means that if YTHD received an update and the user +attempts to change a setting, he must reload the such pages for the settings to take effect -### A kind-of working solution +### A semi working solution -To provide a smooth user experience, I decided to use the last qualities that were fetched. - -This solution is not perfect, since if the user wants to update the quality of the videos in the currently-open web -pages using the popup page, it will not update dynamically. -However, this is the only viable solution, as the alternative would be to auto-reload web pages, which would result in a -bad user experience. +To provide a smooth user experience, I decided to use the last settings that were fetched ## Translating -You can translate the extension to your own language by -filling [this form](https://apps.jeurissen.co/auto-hd-fps-for-youtube/translate). -Filling will grant you access to a Google Sheets spreadsheet via email, in which you can contribute your translations. +You can translate the extension to your own language by filling [this form](https://apps.jeurissen.co/auto-hd-fps-for-youtube/translate) +Filling will grant you access to a Google Spreadsheet via email, in which you can contribute your translations ## Requirements for setting up -Install [Node.js](https://nodejs.org) and [PNPM](https://pnpm.io/installation). +Install [Node.js](https://nodejs.org) and [PNPM](https://pnpm.io/installation) -## Install dependencies: +## Install dependencies ```shell script pnpm i @@ -89,13 +81,8 @@ pnpm run-edge:windows ### Opera on Windows 10/11 -As of Sep 30th, 2023, Opera 102's -installer [automatically sets itself as the default browser](https://www.reddit.com/r/assholedesign/comments/j2j85x), -and -therefore I recommend installing it on a virtual machine -like [Windows Sandbox](https://learn.microsoft.com/en-us/windows/security/application-security/application-isolation/windows-sandbox/windows-sandbox-overview). -Of course, if you decide to go through the virtual machine route, you'll need -to [build & pack](https://github.com/avi12/youtube-auto-hd#build--pack) every time you modify a script. +As of September 30th, 2023, Opera 102's installer [automatically sets itself as the default browser](https://www.reddit.com/r/assholedesign/comments/j2j85x), and therefore I recommend installing it on a virtual machine like [Windows Sandbox](https://learn.microsoft.com/en-us/windows/security/application-security/application-isolation/windows-sandbox/windows-sandbox-overview) +Of course, if you decide to go through this route, you'll need to [build & pack](https://github.com/avi12/youtube-auto-hd#build--pack) every time you modify a script ```shell pnpm run-opera:windows @@ -111,83 +98,79 @@ pnpm run-firefox 1. Install [Android Studio](https://developer.android.com/studio) on your operating system 2. Create an AVD (Android Virtual Device) - - For a phone emulator, choose one that - has [Play Store preinstalled](https://user-images.githubusercontent.com/6422804/167658974-9ec9d13f-d297-4e8b-85d6-376809f34aab.png) - - For a tablet emulator, [follow these steps](https://aamnah.com/android/play_store_emulator_install_missing) after - creating it to have Play Store - preinstalled + - For a phone emulator, choose one that + has [Play Store preinstalled](https://user-images.githubusercontent.com/6422804/167658974-9ec9d13f-d297-4e8b-85d6-376809f34aab.png) + - For a tablet emulator, [follow these steps](https://aamnah.com/android/play_store_emulator_install_missing) after + creating it to have Play Store + preinstalled 3. Run the emulator: ```shell emulator @DEVICE_NAME ``` 4. I recommend creating a Google account specifically to be used with the emulator -5. ### Chromium for Android testing +### Chromium for Android testing 1. Download [Kiwi Browser](https://play.google.com/store/apps/details?id=com.kiwibrowser.browser) 2. First get the emulator ID: ```shell adb devices ``` Then: - - On Windows 10/11, you can run: - ```shell - set id=ID & pnpm build-pack:test-push - ``` - - Otherwise, if you're using PowerShell, run: - ```shell - pnpm build-pack:test; ` - $zip = "chrome-mv3-prod.zip"; ` - $destAndroid = "/storage/emulated/0/Download/$zip"; ` - $ID = "emulator-####"; ` - adb -s $ID shell rm $destAndroid; ` - adb -s $ID push "build/$zip" $destAndroid; - ``` - where you assign `$ID` with the emulator ID - 3.
- Side-load the extension on Kiwi - - Choose zip from storage -
- 4. Select the ZIP in the Downloads folder - 5. To reload, you must first remove the extension and then repeat steps ii-iv - 6. To debug, enter `chrome://inspect/#devices` -6. ### Firefox for Android testing - + - On Windows 10/11, you can run: + ```shell + set id=ID & pnpm build-pack:test-push + ``` + - Otherwise, if you're using PowerShell, run: + ```shell + pnpm build-pack:test; ` + $zip = "chrome-mv3-prod.zip"; ` + $destAndroid = "/storage/emulated/0/Download/$zip"; ` + $ID = "emulator-####"; ` + adb -s $ID shell rm $destAndroid; ` + adb -s $ID push "build/$zip" $destAndroid; + ``` + where you assign `$ID` with the emulator ID + 3.
+ Side-load the extension on Kiwi + + Choose zip from storage +
+ 4. Select the ZIP in the Download folder + 5. To reload, you must first remove the extension and then repeat steps 2-4 + 6. To debug, enter `chrome://inspect/#devices` + +### Firefox for Android testing 1. Download [Firefox](https://play.google.com/store/apps/details?id=org.mozilla.firefox) 2. In the terminal: ```shell adb shell pm grant org.mozilla.firefox android.permission.READ_EXTERNAL_STORAGE ``` 3. In the app: - 1. Press ⋮ (menu button) → Settings → Enable "Remote debugging via USB" - 2. Get the emulator ID via + 1. Press ⋮ (menu button) → Settings → Enable "Remote debugging via USB" + 2. Get the emulator ID via + ```shell + adb devices + ``` + 4. Create 2 terminals + - In the first one, run `dev:firefox` + - In the second one, run ```shell - adb devices + pnpm run-firefox:android --android-device=ID ``` - 4. Create 2 terminals - - In the first one, run `dev:firefox` - - In the second one, run - ```shell - pnpm run-firefox:android --android-device=ID - ``` - where you replace `ID` with the emulator ID + where you replace `ID` with the emulator ID 5. To reload: - - 1. Modify a script - 2. Wait until the extension is re-added - 3. Reload the web page - - Notice that due - to [web-ext run](https://extensionworkshop.com/documentation/develop/web-ext-command-reference/#web-ext-run) - using the same files that Plasmo uses to convert the development files into extension-usable script files, - Plasmo might crash and so you'll have to restart it every time that you modify a script - + 1. Modify a script + 2. Wait until the extension is re-added + 3. Reload the web page + Notice that due to [web-ext run](https://extensionworkshop.com/documentation/develop/web-ext-command-reference/#web-ext-run) + using the same files that Plasmo uses to convert the development files into extension-usable script files, + Plasmo might crash and so you'll have to restart it every time that you modify a script 6. To debug: - 1. Open Firefox on your desktop - 2. In the terminal of `run-firefox:android`, find the remote Firefox debugger port (search "TCP port") - 3. Open `about:debugging#/setup` in Firefox - 4. Type in the text box: `localhost:PORT` - 5. In the left sidebar, next to `localhost:PORT`, click Connect and then click on that list item - 6. Under "Tabs" click Inspect + 1. Open Firefox on your desktop + 2. In the terminal of `run-firefox:android`, find the remote Firefox debugger port (search "TCP port") + 3. Open `about:debugging#/setup` in Firefox + 4. Type in the text box: `localhost:PORT` + 5. In the left sidebar, next to `localhost:PORT`, click Connect and then click on that list item + 6. Under "Tabs" click Inspect ### Sideloading onto your daily driver browser @@ -218,4 +201,4 @@ pnpm build-pack:firefox Feel free to contribute! Keep in mind that the license I chose is [GPL v3](https://github.com/avi12/youtube-auto-hd/blob/main/LICENSE). -If you want to fork, make sure to credit [avi12](https://avi12.com) and link to this repository. +If you want to fork, make sure to credit [Avi](https://avi12.com) and link to this repository.