Merge c24f15b into fe7190b

naver · Nov 30, 2020 · 89aa2f2 · 89aa2f2
2 parents fe7190b + c24f15b
commit 89aa2f2
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 17 deletions.
diff --git a/src/ImReadyManager.ts b/src/ImReadyManager.ts
@@ -6,7 +6,7 @@ MIT license
 import Component from "@egjs/component";
 import { ElementLoader } from "./loaders/ElementLoader";
 import { ArrayFormat, ElementInfo, ImReadyEvents, ImReadyLoaderOptions, ImReadyOptions } from "./types";
-import { hasSkipAttribute, toArray, getContentElements, hasLoadingAttribute } from "./utils";
+import { toArray, getContentElements, hasLoadingAttribute } from "./utils";
 /**
  * @alias eg.ImReady
  * @extends eg.Component
@@ -61,9 +61,7 @@ class ImReadyManager extends Component<ImReadyEvents> {
     const { prefix } = this.options;
 
     this.clear();
-    this.elementInfos = toArray(elements).filter(element => {
-      return !hasSkipAttribute(element, prefix);
-    }).map((element, index) => {
+    this.elementInfos = toArray(elements).map((element, index) => {
       const loader = this.getLoader(element, { prefix });
 
       loader.check();

diff --git a/src/loaders/Loader.ts b/src/loaders/Loader.ts
@@ -6,7 +6,7 @@ MIT license
 import Component from "@egjs/component";
 import { addAutoSizer, removeAutoSizer } from "../AutoSizer";
 import { ImReadyLoaderEvents, ImReadyLoaderOptions } from "../types";
-import { removeEvent, hasSizeAttribute, hasLoadingAttribute, addEvent } from "../utils";
+import { removeEvent, hasSizeAttribute, hasLoadingAttribute, addEvent, hasSkipAttribute } from "../utils";
 
 
 export default abstract class Loader<T extends HTMLElement = any> extends Component<ImReadyLoaderEvents> {
@@ -26,11 +26,11 @@ export default abstract class Loader<T extends HTMLElement = any> extends Compon
       ...options,
     };
     this.element = element as T;
-    this.hasDataSize = hasSizeAttribute(this.element, this.options.prefix);
-    this.hasLoading = hasLoadingAttribute(this.element);
+    this.hasDataSize = hasSizeAttribute(element, this.options.prefix);
+    this.hasLoading = hasLoadingAttribute(element);
   }
   public check() {
-    if (!this.checkElement()) {
+    if (hasSkipAttribute(this.element) || !this.checkElement()) {
       // I'm Ready
       this.onAlreadyReady(true);
       return false;

diff --git a/test/unit/Image.spec.ts b/test/unit/Image.spec.ts
@@ -187,7 +187,42 @@ describe("Test image", () => {
     expect(size1[0]).to.be.equals(size1[1]);
     expect(size2[0]).to.be.not.equals(size2[1]);
   });
+  it("should checks to ignore even if there are images in the skip element.", async () => {
+    // Given
+    el.setAttribute("data-skip", "true");
+    el.innerHTML = `
+      <img src="https://naver.github.io/egjs-infinitegrid/assets/image/19.jpg" data-width="100" data-height="100" style="width: 100%;"/>
+      <img src="https://naver.github.io/egjs-infinitegrid/assets/image/20.jpg" data-width="100" data-height="100" style="width: 100%;"/>
+      <img src="https://naver.github.io/egjs-infinitegrid/assets/image/21.jpg" data-width="100" data-height="100" style="width: 100%;"/>
+    `;
+    const readyElementSpy = spy();
+    const readySpy = spy();
+    const preReadyElementSpy = spy();
+    const preReadySpy = spy();
+    const events = checkEventOrders(im);
+
+    im.on("preReadyElement", preReadyElementSpy);
+    im.on("preReady", preReadySpy);
+    im.on("readyElement", readyElementSpy);
+    im.on("ready", readySpy);
 
+    // When
+    im.check([el]);
+
+    await waitEvent(im, "ready");
+
+    // Then
+    expect(readyElementSpy.callCount).to.be.equals(1);
+    expect(readySpy.args[0][0].totalCount).to.be.equals(1);
+    expect(preReadyElementSpy.callCount).to.be.equals(1);
+    expect(preReadySpy.args[0][0].totalCount).to.be.equals(1);
+    expect(im.getTotalCount()).to.be.equals(1);
+
+    expectOrders(events, [
+      "preReadyElement", "readyElement",
+      "preReady", "ready",
+    ]);
+  });
   it("should check that ignored when the property include a skip attribute.", async () => {
     // Given
     el.innerHTML = `
@@ -212,15 +247,16 @@ describe("Test image", () => {
     await waitEvent(im, "ready");
 
     // Then
-    expect(readyElementSpy.callCount).to.be.equals(2);
-    expect(readySpy.args[0][0].totalCount).to.be.equals(2);
-    expect(preReadyElementSpy.callCount).to.be.equals(2);
-    expect(preReadySpy.args[0][0].totalCount).to.be.equals(2);
-    expect(im.getTotalCount()).to.be.equals(2);
+    expect(readyElementSpy.callCount).to.be.equals(3);
+    expect(readySpy.args[0][0].totalCount).to.be.equals(3);
+    expect(preReadyElementSpy.callCount).to.be.equals(3);
+    expect(preReadySpy.args[0][0].totalCount).to.be.equals(3);
+    expect(im.getTotalCount()).to.be.equals(3);
 
     // readyElement
-    expect(events[4].isPreReadyOver).to.be.equals(true);
+    expect(events[6].isPreReadyOver).to.be.equals(true);
     expectOrders(events, [
+      "preReadyElement", "readyElement",
       "preReadyElement", "preReadyElement", "preReady",
       "readyElement", "readyElement", "ready",
     ]);

diff --git a/test/unit/video.spec.ts b/test/unit/video.spec.ts
@@ -188,9 +188,9 @@ describe("Test video", () => {
     await waitEvent(im, "ready");
 
     // Then
-    expect(readyElementSpy.callCount).to.be.equals(2);
-    expect(readySpy.args[0][0].totalCount).to.be.equals(2);
-    expect(im.getTotalCount()).to.be.equals(2);
+    expect(readyElementSpy.callCount).to.be.equals(3);
+    expect(readySpy.args[0][0].totalCount).to.be.equals(3);
+    expect(im.getTotalCount()).to.be.equals(3);
   });
   it("should check that AutoSizer works when window resize (400 => 600)", async () => {
     // Given