From 6252e166a938ea0486b3f619984ff6ca91238725 Mon Sep 17 00:00:00 2001
From: Joe <xyz.hunabku@gmail.com>
Date: Wed, 3 Nov 2021 18:47:16 +0800
Subject: [PATCH] Add tests

---
 .../tests/acceptance/mobile-discovery-test.js        | 12 +++++++++++-
 .../tests/acceptance/topic-discovery-test.js         |  6 ++++++
 .../discourse/tests/unit/lib/utilities-test.js       |  6 +++---
 3 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/discourse/tests/acceptance/mobile-discovery-test.js b/app/assets/javascripts/discourse/tests/acceptance/mobile-discovery-test.js
index 700554d1d37..373896fe0d1 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/mobile-discovery-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/mobile-discovery-test.js
@@ -1,4 +1,8 @@
-import { acceptance, exists } from "discourse/tests/helpers/qunit-helpers";
+import {
+  acceptance,
+  exists,
+  queryAll,
+} from "discourse/tests/helpers/qunit-helpers";
 import { test } from "qunit";
 import { visit } from "@ember/test-helpers";
 
@@ -9,6 +13,12 @@ acceptance("Topic Discovery - Mobile", function (needs) {
     assert.ok(exists(".topic-list"), "The list of topics was rendered");
     assert.ok(exists(".topic-list .topic-list-item"), "has topics");
 
+    assert.equal(
+      queryAll("a[data-user-card=codinghorror] img.avatar").attr("loading"),
+      "lazy",
+      "it adds loading=`lazy` to topic list avatars"
+    );
+
     await visit("/categories");
     assert.ok(exists(".category"), "has a list of categories");
   });
diff --git a/app/assets/javascripts/discourse/tests/acceptance/topic-discovery-test.js b/app/assets/javascripts/discourse/tests/acceptance/topic-discovery-test.js
index eccc827c115..3002c1024e6 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/topic-discovery-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/topic-discovery-test.js
@@ -27,6 +27,12 @@ acceptance("Topic Discovery", function (needs) {
       "it shows user's full name in avatar title"
     );
 
+    assert.equal(
+      queryAll("a[data-user-card=eviltrout] img.avatar").attr("loading"),
+      "lazy",
+      "it adds loading=`lazy` to topic list avatars"
+    );
+
     await visit("/c/bug");
     assert.ok(exists(".topic-list"), "The list of topics was rendered");
     assert.ok(exists(".topic-list .topic-list-item"), "has topics");
diff --git a/app/assets/javascripts/discourse/tests/unit/lib/utilities-test.js b/app/assets/javascripts/discourse/tests/unit/lib/utilities-test.js
index c863511c12c..a6bc2a403b9 100644
--- a/app/assets/javascripts/discourse/tests/unit/lib/utilities-test.js
+++ b/app/assets/javascripts/discourse/tests/unit/lib/utilities-test.js
@@ -100,7 +100,7 @@ discourseModule("Unit | Utilities", function () {
     let avatarTemplate = "/path/to/avatar/{size}.png";
     assert.equal(
       avatarImg({ avatarTemplate: avatarTemplate, size: "tiny" }),
-      "<img alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar'>",
+      "<img loading='lazy' alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar'>",
       "it returns the avatar html"
     );
 
@@ -110,7 +110,7 @@ discourseModule("Unit | Utilities", function () {
         size: "tiny",
         title: "evilest trout",
       }),
-      "<img alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar' title='evilest trout' aria-label='evilest trout'>",
+      "<img loading='lazy' alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar' title='evilest trout' aria-label='evilest trout'>",
       "it adds a title if supplied"
     );
 
@@ -120,7 +120,7 @@ discourseModule("Unit | Utilities", function () {
         size: "tiny",
         extraClasses: "evil fish",
       }),
-      "<img alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar evil fish'>",
+      "<img loading='lazy' alt='' width='20' height='20' src='/path/to/avatar/40.png' class='avatar evil fish'>",
       "it adds extra classes if supplied"
     );