From 5d53344b75141a0f773a07ae505c02f6e2d6d8ce Mon Sep 17 00:00:00 2001
From: Sasha Sorokin <10401817+Brawaru@users.noreply.github.com>
Date: Mon, 12 Sep 2022 17:14:32 +0200
Subject: [PATCH] More reliably detect ad load faults (#661)

Detecting that ad has failed to load with timeout is not accurate and
won't work on slow connections. This commit fixes that by changing
detection to use 'onerror' event on <script> tag instead, which will be
triggered if ad script fails to load due to blocking.
---
 components/ads/Advertisement.vue | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/components/ads/Advertisement.vue b/components/ads/Advertisement.vue
index 53124ea9..755acfbc 100644
--- a/components/ads/Advertisement.vue
+++ b/components/ads/Advertisement.vue
@@ -7,6 +7,7 @@
         async
         type="text/javascript"
         src="//cdn.carbonads.com/carbon.js?serve=CEAIKK3N&placement=modrinthcom"
+        @error="onBlocked"
       ></script>
     </client-only>
   </div>
@@ -15,13 +16,8 @@
 <script>
 export default {
   name: 'Advertisement',
-  data() {
-    return {
-      isBlocked: false,
-    }
-  },
-  mounted() {
-    setTimeout(() => {
+  methods: {
+    onBlocked() {
       this.$refs['carbon-script'].outerHTML += `
       <div id="info-popup">
         <span>
@@ -53,7 +49,7 @@ export default {
         </span>
       </div>
       `
-    }, 1000)
+    },
   },
 }
 </script>