Merge branch 'master' into feature/player-ui

CHANGELOG.md

@@ -16,16 +16,23 @@
 
 ## v4.x (current major)
 
+### v4.5.2
+
+* Fixed the issue where videos would sometimes get misaligned while using hybrid stretch, except for real this time. ([#125](https://github.com/tamius-han/ultrawidify/issues/125))
+* Improved DRM detection (the 'autodetection cannot work on this site' popup should now no longer show up on the sites where autodetection _can_ work)
+
 ### v4.5.1
 
 * Fixed the misalignment issue on netflix ... hopefully.
 * 'Site settings' tab should now work in Chrome as well ([#126](https://github.com/tamius-han/ultrawidify/issues/126))
 * Popup interface now refreshes properly ([#127](https://github.com/tamius-han/ultrawidify/issues/127))
 * Videos should now be scaled correctly when the display is narrower than video's native aspect ratio ([#118](https://github.com/tamius-han/ultrawidify/issues/118))
-* Edge users using CWS version of the extension get a very aggressive warning when trying to use the extension with Edge
 * Fullscreen videos on streamable are aligned correctly ([#116](https://github.com/tamius-han/ultrawidify/issues/118)).
 * **[4.5.1.1]** Streamable fix broke old.reddit + RES on embeds from v.redd.it and streamable.com. We're now using an alternative implementation. ([#128](https://github.com/tamius-han/ultrawidify/issues/128))
 * **[4.5.1.2]** Fixed the issue where videos would sometimes get misaligned while using hybrid stretch. ([#125](https://github.com/tamius-han/ultrawidify/issues/125))
+* **[4.5.1.3]** Added fix for disney plus
+* **[4.5.1.3]** Microsoft Edge has fixed the bugs that prevented the extension from working properly. Popup should no longer be shown.
+
 
 ### v4.5.0 (Current)
 

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ultrawidify",
-  "version": "4.5.1",
+  "version": "4.5.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,11 +1,11 @@
 {
   "name": "ultrawidify",
-  "version": "4.5.1",
+  "version": "4.5.2",
   "description": "Aspect ratio fixer for youtube and other sites, with automatic aspect ratio detection. Supports ultrawide and other ratios.",
   "author": "Tamius Han <tamius.han@gmail.com>",
   "scripts": {
     "build": "npm run pre-build; cross-env NODE_ENV=production BROWSER=firefox CHANNEL=stable webpack --hide-modules",
-    "build-all": "mkdir -p ./build/old; npm run pre-build; rm ./dist-zip/uw-amo-source.zip; mv -f ./dist-zip/*.zip ./build/old; npm run build; node scripts/build-zip.js ff; npm run build-chrome; node scripts/build-zip.js chrome; ./scripts/prepare-amo-source.sh",
+    "build-all": "mkdir -p ./build/old; npm run pre-build; rm ./dist-zip/uw-amo-source.zip; mv -f ./dist-zip/*.zip ./build/old; npm run build; node scripts/build-zip.js ff; npm run build-chrome; node scripts/build-zip.js chrome; npm run build-edge; node scripts/build-zip.js edge; ./scripts/prepare-amo-source.sh",
     "build-chrome": "cross-env NODE_ENV=production BROWSER=chrome CHANNEL=stable webpack --hide-modules",
     "build-chrome:dev": "cross-env NODE_ENV=development BROWSER=chrome webpack --hide-modules",
     "build-edge": "cross-env NODE_ENV=production BROWSER=edge CHANNEL=stable webpack --hide-modules",

src/common/enums/aspect-ratio.enum.js

@@ -6,6 +6,19 @@ var AspectRatio = Object.freeze({
   FitHeight: 3,   // legacy/dynamic: fit to height
   Fixed: 4,       // pre-determined aspect ratio
   Manual: 5,      // ratio achieved by zooming in/zooming out
+
+  toString: (ar) => {
+    switch (ar) {
+      case -1: return 'Initial';
+      case 0:  return 'Reset';
+      case 1:  return 'Automatic';
+      case 2:  return 'FitWidth';
+      case 3:  return 'FitHeight';
+      case 4:  return 'Fixed';
+      case 5:  return 'Manual';
+      default: return '<not an valid enum value>'
+    }
+  }
 });
 
 export default AspectRatio;

src/csui/PlayerUiComponent.vue

@@ -61,6 +61,9 @@ export default {
     console.log("store:", this.$store, this);
   },
   methods: {
+    getUrl(url) {
+      return BrowserDetect.getURL(url);
+    },
   }
 }
 </script>

src/ext/conf/BrowserDetect.js

@@ -4,16 +4,28 @@ if (process.env.CHANNEL !== 'stable') {
   console.info('Loaded BrowserDetect');
 }
 
+function detectEdgeUA() {
+  return /Edg\/(\.?[0-9]*)*$/.test(window.navigator.userAgent);
+}
+
+function getBrowserObj() {
+  return process.env.BROWSER === 'firefox' ? browser : chrome;
+}
+
+function getURL(url) {
+  return process.env.BROWSER === 'firefox' ? browser.runtime.getURL(url) : chrome.runtime.getURL(url);
+}
 
 const BrowserDetect = {
   firefox: process.env.BROWSER === 'firefox',
+  anyChromium: process.env.BROWSER !== 'firefox',
   chrome: process.env.BROWSER === 'chrome',
   edge: process.env.BROWSER === 'edge',
   processEnvBrowser: process.env.BROWSER,
   processEnvChannel: process.env.CHANNEL,
-  isEdgeUA: () => /Edg\/(\.?[0-9]*)*$/.test(window.navigator.userAgent),
+  isEdgeUA: detectEdgeUA(),
-  getBrowserObj: () => { return process.env.BROWSER === 'firefox' ? browser : chrome; },
+  browserObj: getBrowserObj(),
-  getURL: (url) => { console.log('getting file:', url); console.log(process.env.BROWSER === 'firefox' ? browser.runtime.getURL(url) : chrome.runtime.getURL(url)); return process.env.BROWSER === 'firefox' ? browser.runtime.getURL(url) : chrome.runtime.getURL(url); },
+  getURL: (url) => getURL(url),
 } 
 
 if (process.env.CHANNEL !== 'stable') {

src/ext/conf/ExtConfPatches.js

@@ -436,6 +436,15 @@ const ExtensionConfPatch = [
         userOptions.sites['streamable.com'].css = '.player {text-align: left}'
       };
     }
+  }, {
+    forVersion: '4.5.1.3',
+    updateFn: (userOptions, defaultOptions) => {
+      try {
+        userOptions.sites['wwww.disneyplus.com']['css'] = ".hudson-container {\n  height: 100%;\n}";
+      } catch (e) {
+        // do nothing if disney+ is missing
+      }
+    }
   }
 ];
 

src/ext/conf/ExtensionConf.js

@@ -1066,7 +1066,8 @@ var ExtensionConf = {
           "useRelativeAncestor": false,
           "playerNodeCss": ""
         }
-      }
+      },
+      css: ".hudson-container { height: 100%; }",
     },
     "www.twitch.tv": {
       mode: ExtensionMode.Enabled,
@@ -1145,13 +1146,6 @@ var ExtensionConf = {
       },
       css: 'video {\n  width: 100% !important;\n  height: 100% !important;\n}',
     },
-    "www.disneyplus.com": {
-      DOM: {
-        player: {
-          periodicallyRefreshPlayerElement: true,
-        }
-      }
-    },
     "imgur.com": {
       mode: -1,
       autoar: -1,

src/ext/lib/ar-detect/ArDetector.js

@@ -474,19 +474,19 @@ class ArDetector {
     
     // poglejmo, če se je razmerje stranic spremenilo
     // check if aspect ratio is changed:
-    var lastAr = this.conf.resizer.getLastAr();
+    let lastAr = this.conf.resizer.getLastAr();
     if (lastAr.type === AspectRatio.Automatic && lastAr.ratio !== null && lastAr.ratio !== undefined){
       // spremembo lahko zavrnemo samo, če uporabljamo avtomatski način delovanja in če smo razmerje stranic
       // že nastavili.
       //
       // we can only deny aspect ratio changes if we use automatic mode and if aspect ratio was set from here.
       
-      var arDiff = trueAr - lastAr.ar;
+      let arDiff = trueAr - lastAr.ar;
       
       if (arDiff < 0)
         arDiff = -arDiff;
       
-      var arDiff_percent = arDiff / trueAr;
+      const arDiff_percent = arDiff / trueAr;
       
       // ali je sprememba v mejah dovoljenega? Če da -> fertik
       // is ar variance within acceptable levels? If yes -> we done
@@ -526,6 +526,13 @@ class ArDetector {
    * completely opaque (i.e. have value of 255))
    */
   hasDRM() {
+    // oh btw, there's one exception. There is this brief period between the point
+    // when metadata (video dimensions) have loaded and the moment the video starts
+    // playing where ctx.drawImage() will draw a transparent black square regardless
+    // of whether the video is actually DRM-protected or not.
+    if (! this.conf.hasVideoStartedPlaying()) {
+      return false;
+    }
     return this.blackframeContext.getImageData(0,0,1,1).data[3] === 0;
   }
 
@@ -552,27 +559,25 @@ class ArDetector {
       // special browsers require special tests
       if (this.hasDRM()) {
         this.fallbackMode = false;
-        throw 'Video is protected by DRM. Autodetection cannot run here.';
+        throw 'VIDEO_DRM_PROTECTED';
       }
       this.fallbackMode = false;
     } catch (e) {
       this.logger.log('error', 'arDetect', `%c[ArDetect::frameCheck] <@${this.arid}>  %c[ArDetect::frameCheck] can't draw image on canvas. ${this.canDoFallbackMode ? 'Trying canvas.drawWindow instead' : 'Doing nothing as browser doesn\'t support fallback mode.'}`, "color:#000; backgroud:#f51;", e);
 
-      // nothing to see here, really, if fallback mode isn't supported by browser
-      if (!this.drmNotificationShown) {
-        this.drmNotificationShown = true;
-
-        // if we detect Edge, we'll throw the aggressive popup
-        this.conf.player.showEdgeNotification();
-        this.conf.player.showNotification('AARD_DRM');
-
-        this.conf.resizer.setAr({type: AspectRatio.Reset});
-        return;
-      } 
-
       // in case of DRM errors, we need to prevent the execution to reach the aspec
-      // ratio setting part of this function
+      // ratio setting part of this function. For the time being, we're only stopping
-      if (e === 'Video is protected by DRM. Autodetection cannot run here.') {
+      // in case we encounter DRM error in Chrome. Firefox has fallback mode and generates
+      // different error, so that goes.
+      if (e === 'VIDEO_DRM_PROTECTED') {
+        // nothing to see here, really, if fallback mode isn't supported by browser
+        if (!this.drmNotificationShown) {
+          this.drmNotificationShown = true;
+
+          this.conf.player.showNotification('AARD_DRM');
+          this.conf.resizer.setAr({type: AspectRatio.Reset});
+        } 
+
         return;
       }
 

src/ext/lib/comms/CommsClient.js

@@ -11,7 +11,7 @@ class CommsClient {
 
     if (BrowserDetect.firefox) {
       this.port = browser.runtime.connect({name: name});
-    } else if (BrowserDetect.chrome) {
+    } else if (BrowserDetect.anyChromium) {
       this.port = chrome.runtime.connect({name: name});
     }
 

src/ext/lib/video-data/PlayerData.js

@@ -489,9 +489,9 @@ class PlayerData {
    * NOTE: this method needs to be deleted once Edge gets its shit together.
    */
   showEdgeNotification() {
-    if (BrowserDetect.isEdgeUA() && !this.settings.active.mutedNotifications?.browserSpecific?.edge?.brokenDrm?.[window.hostname]) {
+    // if (BrowserDetect.isEdgeUA && !this.settings.active.mutedNotifications?.browserSpecific?.edge?.brokenDrm?.[window.hostname]) {
-      this.ui = new PlayerUi(this.element, this.settings);
+    //   this.ui = new PlayerUi(this.element, this.settings);
-    }
+    // }
   }
 }
 

src/ext/lib/video-data/VideoData.js

@@ -33,6 +33,9 @@ class VideoData {
 
   async onVideoLoaded() {
     if (!this.videoLoaded) {
+      if (!this.video.videoWidth || !this.video.videoHeight) {
+        return; // onVideoLoaded is a lie in this case
+      }
       this.logger.log('info', 'init', '%c[VideoData::onVideoLoaded] ——————————— Initiating phase two of videoData setup ———————————', 'color: #0f9');
 
       this.videoLoaded = true;
@@ -48,10 +51,13 @@ class VideoData {
 
       this.restoreCrop();
       this.videoDimensionsLoaded = true;
-
     }
   }
 
+  videoUnloaded() {
+    this.videoLoaded = false;
+  }
+
   async injectBaseCss() {
     try {
     await this.pageInfo.injectCss(`
@@ -71,25 +77,43 @@ class VideoData {
     this.video.classList.remove('uw-ultrawidify-base-wide-screen');
   }
 
+  //#region <video> event handlers
+  onLoadedData() {
+    this.logger.log('info', 'init', '[VideoData::ctor->video.onloadeddata] Video fired event "loaded data!"');
+    this.onVideoLoaded();
+  }
+  onLoadedMetadata() {
+    this.logger.log('info', 'init', '[VideoData::ctor->video.onloadedmetadata] Video fired event "loaded metadata!"');
+    this.onVideoLoaded();
+  }
+  onTimeUpdate() {
+    this.onVideoLoaded();
+  }
+  //#endregion
+
+  //#region lifecycle-ish
+  /**
+   * Injects base CSS and sets up handlers for <video> tag events
+   */
   async setupStageOne() {
     this.logger.log('info', 'init', '%c[VideoData::setupStageOne] ——————————— Starting setup stage one! ———————————', 'color: #0f9');
     // ensure base css is loaded before doing anything
     this.injectBaseCss();
 
     // this is in case extension loads before the video
-    this.video.addEventListener('loadeddata', () => {
+    this.video.addEventListener('loadeddata', this.onLoadedData.bind(this));
-      this.logger.log('info', 'init', '[VideoData::ctor->video.onloadeddata] Video fired event "loaded data!"');
+    this.video.addEventListener('loadedmetadata', this.onLoadedMetadata.bind(this));
-      this.onVideoLoaded();
-    });
 
     // this one is in case extension loads after the video is loaded
-    this.video.addEventListener('timeupdate', () => {
+    this.video.addEventListener('timeupdate', this.onTimeUpdate.bind(this));
-      this.onVideoLoaded();
-    });
 
     this.logger.log('info', 'init', '%c[VideoData::setupStageOne] ——————————— Setup stage one complete! ———————————', 'color: #0f9');
   }
 
+  /**
+   * Launches the extension for a given video (after the video element is defined well enough
+   * for our standards)
+   */
   async setupStageTwo() {
     // POZOR: VRSTNI RED JE POMEMBEN (arDetect mora bit zadnji)
     // NOTE: ORDERING OF OBJ INITIALIZATIONS IS IMPORTANT (arDetect needs to go last)
@@ -158,6 +182,52 @@ class VideoData {
     }
   }
 
+  /**
+   * cleans up handlers and stuff when the show is over
+   */
+  destroy() {
+    this.logger.log('info', ['debug', 'init'], `[VideoData::destroy] <vdid:${this.vdid}> received destroy command`);
+
+    if (this.video) {
+      this.video.classList.remove(this.userCssClassName);
+      this.video.classList.remove('uw-ultrawidify-base-wide-screen'); 
+
+      this.video.removeEventListener('onloadeddata', this.onLoadedData);
+      this.video.removeEventListener('onloadedmetadata', this.onLoadedMetadata);
+      this.video.removeEventListener('ontimeupdate', this.onTimeUpdate);
+    }
+
+    this.pause();
+    this.destroyed = true;
+    try {
+      this.arDetector.stop();
+      this.arDetector.destroy();
+    } catch (e) {}
+    this.arDetector = undefined;
+    try {
+      this.resizer.destroy();
+    } catch (e) {}
+    this.resizer = undefined;
+    try {
+      this.player.destroy();
+    } catch (e) {}
+    try {
+      this.observer.disconnect();
+    } catch (e) {}
+    this.player = undefined;
+    this.video = undefined;
+  }
+  //#endregion
+
+  //#region video status
+  isVideoPlaying() {
+    return this.video && !!(this.video.currentTime > 0 && !this.video.paused && !this.video.ended && this.video.readyState > 2);
+  }
+
+  hasVideoStartedPlaying() {
+    return this.video && this.video.currentTime > 0;
+  }
+  //#endregion
 
   restoreCrop() {  
     this.logger.log('info', 'debug', '[VideoData::restoreCrop] Attempting to reset aspect ratio.')
@@ -378,35 +448,6 @@ class VideoData {
     }
   }
 
-  destroy() {
-    this.logger.log('info', ['debug', 'init'], `[VideoData::destroy] <vdid:${this.vdid}> received destroy command`);
-
-    if (this.video) {
-      this.video.classList.remove(this.userCssClassName);
-      this.video.classList.remove('uw-ultrawidify-base-wide-screen'); 
-    }
-
-    this.pause();
-    this.destroyed = true;
-    try {
-      this.arDetector.stop();
-      this.arDetector.destroy();
-    } catch (e) {}
-    this.arDetector = undefined;
-    try {
-      this.resizer.destroy();
-    } catch (e) {}
-    this.resizer = undefined;
-    try {
-      this.player.destroy();
-    } catch (e) {}
-    try {
-      this.observer.disconnect();
-    } catch (e) {}
-    this.player = undefined;
-    this.video = undefined;
-  }
-
   pause(){
     this.paused = true;
     if(this.arDetector){

src/ext/lib/video-transform/Resizer.js

@@ -146,7 +146,8 @@ class Resizer {
     }
     
     if (!this.video.videoWidth || !this.video.videoHeight) {
-      this.logger.log('warning', 'debug', '[Resizer::setAr] <rid:'+this.resizerId+'> Video has no width or no height. This is not allowed. Aspect ratio will not be set.');
+      this.logger.log('warning', 'debug', '[Resizer::setAr] <rid:'+this.resizerId+'> Video has no width or no height. This is not allowed. Aspect ratio will not be set, and videoData will be uninitialized.');
+      this.conf.videoUnloaded();
     }
   
     this.logger.log('info', 'debug', '[Resizer::setAr] <rid:'+this.resizerId+'> trying to set ar. New ar:', ar)

src/ext/uw-bg.js

@@ -69,7 +69,7 @@ class UWServer {
 
     if(BrowserDetect.firefox) {
       browser.tabs.onActivated.addListener((m) => {this.onTabSwitched(m)});  
-    } else if (BrowserDetect.chrome) {
+    } else if (BrowserDetect.anyChromium) {
       chrome.tabs.onActivated.addListener((m) => {this.onTabSwitched(m)});
     }
   }
@@ -84,7 +84,7 @@ class UWServer {
     try {
       if (BrowserDetect.firefox || BrowserDetect.edge) {
         browser.tabs.insertCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
-      } else if (BrowserDetect.chrome) {
+      } else if (BrowserDetect.anyChromium) {
         chrome.tabs.insertCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
       }
     } catch (e) {
@@ -95,7 +95,7 @@ class UWServer {
     try {
       if (BrowserDetect.firefox || BrowserDetect.edge) {
         browser.tabs.removeCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
-      } else if (BrowserDetect.chrome) {
+      } else if (BrowserDetect.anyChromium) {
         // this doesn't work currently, but hopefully chrome will get this feature in the future
         chrome.tabs.removeCSS(sender.tab.id, {code: css, cssOrigin: 'user', frameId: sender.frameId});
       }
@@ -141,7 +141,7 @@ class UWServer {
       let tab;
       if (BrowserDetect.firefox) {
         tab = await browser.tabs.get(this.currentTabId);
-      } else if (BrowserDetect.chrome) {
+      } else if (BrowserDetect.anyChromium) {
         tab = await this._promisifyTabsGet(chrome, this.currentTabId);
       }
 
@@ -223,7 +223,7 @@ class UWServer {
           file: '/ext/uw-ui.js',
           allFrames: true,
         });
-      } else if (BrowserDetect.chrome) {
+      } else if (BrowserDetect.anyChromium) {
         await new Promise( resolve => 
           chrome.tabs.executeScript({
             file: '/ext/uw-ui.js',
@@ -269,7 +269,7 @@ class UWServer {
   async getCurrentTab() {
     if (BrowserDetect.firefox) {
       return (await browser.tabs.query({active: true, currentWindow: true}))[0];
-    } else if (BrowserDetect.chrome) {
+    } else if (BrowserDetect.anyChromium) {
       return new Promise((resolve, reject) => chrome.tabs.query({active: true, currentWindow: true}, (x) => resolve(x[0])));
     }
   }

src/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 2,
   "name": "Ultrawidify",
   "description": "Removes black bars on ultrawide videos and offers advanced options to fix aspect ratio.",
-  "version": "4.5.1.2",
+  "version": "4.5.2",
   "applications": {
     "gecko": {
       "id": "{cf02b1a7-a01a-4e37-a609-516a283f1ed3}"

src/options/GeneralSettings.vue

@@ -216,7 +216,7 @@ export default {
           // reminder — webextension-polyfill doesn't seem to work in vue!
           await browser.permissions.request({permissions: ['downloads']});
           browser.downloads.download({saveAs: true, filename: 'ultrawidify-settings.json', url: fileUrl});
-        } else if (BrowserDetect.chrome) {
+        } else if (BrowserDetect.anyChromium) {
           const ths = this;
           
           chrome.permissions.request(

src/popup/App.vue

@@ -20,6 +20,17 @@
         Build channel: {{BrowserDetect.processEnvChannel}}
       </div>
     </div>
+    <div  v-if="BrowserDetect.isEdgeUA" style="margin: 2px 12px; border: 1px solid #fa6; color: #fa6" class="flex flex-row flex-center">
+      <div class="flex-nogrow flex-nosrhink flex flex-center" style="font-size: 2em">
+        <Icon icon="exclamation-triangle"></Icon>
+      </div>
+      <div class="flex-grow padding-right: 1em; line-height: 1">
+        <small>
+          <b>NOTE:</b> please ensure your Windows and Edge have the latest updates in order for this extension to work on DRM-protected sites.
+          If your Windows and Edge are not up to date, videos on sites like Netflix, Hulu, and Disney+ may not be aligned and cropped correctly.
+        </small>
+      </div>
+    </div>
     <div 
       v-if="narrowPopup"
       class="w100 show-more flex flex-row flex-center flex-cross-center menu-button"
@@ -261,7 +272,7 @@ export default {
         cmd: 'unmark-player',
         forwardToAll: true,
       });
-      if (BrowserDetect.chrome) {
+      if (BrowserDetect.anyChromium) {
         chrome.extension.getBackgroundPage().sendUnmarkPlayer({
           cmd: 'unmark-player',
           forwardToAll: true,

src/popup/panels/WhatsNewPanel.vue

@@ -2,28 +2,13 @@
   <div>
     <h2>What's new</h2>
     <p>Full changelog for older versions <a href="https://github.com/tamius-han/ultrawidify/blob/master/CHANGELOG.md">is available here</a>.</p>
-    <p class="label">4.5.1</p>
+    <p class="label">4.5.2</p>
     <ul>
-      <li>Fixed the misalignment issue on netflix ... hopefully.</li>
       <li>
-        'Site settings' tab should now work in Chrome as well (<a href="https://github.com/tamius-han/ultrawidify/issues/126">#126</a>)
+        Fixed the issue where videos would sometimes get misaligned while using hybrid stretch, except for real this time. (<a href="https://github.com/tamius-han/ultrawidify/issues/125">#125</a>)
       </li>
       <li>
-        Popup interface now refreshes properly (<a href="https://github.com/tamius-han/ultrawidify/issues/127">#127</a>)
+        Improved DRM detection (the 'autodetection cannot work on this site' popup should now no longer show up on the sites where autodetection <i>can</i> work)
-      </li>
-      <li>
-        Videos should now be scaled correctly when the display is narrower than video's native aspect ratio (<a href="https://github.com/tamius-han/ultrawidify/issues/118">#118</a>)
-      </li>
-      <li>
-        Fullscreen videos on streamable are aligned correctly (<a href="https://github.com/tamius-han/ultrawidify/issues/118">#116</a>). Note that while this fix hasn't broken any sites I have access to and know of,
-        there is a small possibility that this bugfix may break something somewhere. If this happens on a site you use, please notify me via github, email or PM me on reddit.
-      </li>
-      <li>
-        Edge users using CWS version of the extension get a very aggressive warning when trying to use the extension with Edge
-      </li>
-      <li>
-        <b>[4.5.1.1]</b> Streamable fix broke old.reddit + RES on embeds from v.redd.it and streamable.com. We're now using an alternative implementation. (<a href="https://github.com/tamius-han/ultrawidify/issues/128">#128</a>)
-        <b>[4.5.1.2]</b> Fixed the issue where videos would sometimes get misaligned while using hybrid stretch. (<a href="https://github.com/tamius-han/ultrawidify/issues/125">#125</a>)
       </li>
     </ul>
   </div>

webpack.config.js

@@ -121,7 +121,7 @@ const config = {
                                             .substr(2)         // YYYY -> YY
                                             .replace('-', '')  // YY-MM-DD -> YYMM-DD
                                             .replace('-', '.') // YYMM-DD -> YYMM.DD
-                                    }.${process.env.BUILD_NUMBER}`;
+                                    }.${process.env.BUILD_NUMBER ?? 0}`;
             jsonContent.browser_action.default_title = "Ultrawidify Nightly";
             
             // because we don't want web-ext to submit this as proper release
@@ -137,7 +137,7 @@ const config = {
                                             .substr(2)         // YYYY -> YY
                                             .replace('-', '')  // YY-MM-DD -> YYMM-DD
                                             .replace('-', '.') // YYMM-DD -> YYMM.DD
-                                    }.${process.env.BUILD_NUMBER}`;
+                                    }.${process.env.BUILD_NUMBER ?? 0}`;
             jsonContent.browser_action.default_title = "Ultrawidify Testing";
             
             // because we don't want web-ext to submit this as proper release