Fix instanceof implementation for mocked Dates (#616) (#616)

By adding Symbol.hasInstance to MockDate we allow for instanceof to work with mocked Dates.
When the global Date object is replaced with a mocked one unmocked Dates
are also instances of MockedDate and vice versa.

Author: runjak

.changeset/warm-ladybugs-admire.md

@@ -0,0 +1,5 @@
+---
+"@ladle/react": patch
+---
+
+Fix instanceof implementation for mocked Dates

e2e/decorators/src/mock-date.stories.tsx

@@ -31,3 +31,21 @@ export const Inactive: Story = () => {
     </h1>
   );
 };
+
+export const Instanceof: Story = () => {
+  const mockDate = new Date();
+  const realDate = new Date(1234);
+
+  return (
+    <dl>
+      <dt>mockDate instanceof Date:</dt>
+      <dd data-testid="mockDate">{mockDate instanceof Date ? "yes" : "no"}</dd>
+      <dt>realDate instanceof Date:</dt>
+      <dd data-testid="realDate">{realDate instanceof Date ? "yes" : "no"}</dd>
+    </dl>
+  );
+};
+
+Instanceof.meta = {
+  mockDate: "1995-12-17T03:24:00",
+};

e2e/decorators/tests/mock-date.spec.ts

@@ -25,3 +25,10 @@ test("the date is current", async ({ page }) => {
     }),
   );
 });
+
+test("MockDate works with instanceof", async ({ page }) => {
+  await page.goto("/?story=mock-date--instanceof");
+
+  await expect(page.locator('[data-testid="mockDate"]')).toHaveText("yes");
+  await expect(page.locator('[data-testid="realDate"]')).toHaveText("yes");
+});

e2e/decorators/tests/params.spec.ts

@@ -69,6 +69,17 @@ test("meta.json is correctly using defaults and overrides", async ({
           name: "Inactive",
           namedExport: "Inactive",
         },
+        "mock-date--instanceof": {
+          filePath: "src/mock-date.stories.tsx",
+          levels: ["Mock date"],
+          locEnd: 47,
+          locStart: 35,
+          meta: {
+            mockDate: "1995-12-17T03:24:00",
+          },
+          name: "Instanceof",
+          namedExport: "Instanceof",
+        },
         "root--examples--first": {
           filePath: "src/params.stories.tsx",
           levels: ["Root", "Examples"],

packages/ladle/lib/app/src/mock-date.ts

@@ -56,6 +56,10 @@ const MockDate = class Date extends RealDate {
 
     return date;
   }
+
+  static [Symbol.hasInstance](instance: unknown): boolean {
+    return instance instanceof RealDate;
+  }
 };
 
 MockDate.UTC = RealDate.UTC;