number format tests

pikax · Apr 13, 2020 · 594bd69 · 594bd69
1 parent 7cf5568
commit 594bd69
Show file tree

Hide file tree

Showing 4 changed files with 96 additions and 10 deletions.
diff --git a/packages/web/__tests__/intl/_helper.spec.ts b/packages/web/__tests__/intl/_helper.spec.ts
@@ -68,7 +68,7 @@ describe("intl_helper", () => {
       options = ref(undefined);
       expect(intlDateFormatExtractArguments(locale, options)).toMatchObject([
         locale,
-        undefined
+        options
       ]);
 
       options = ref({ currencyDisplay: "ss" });

diff --git a/packages/web/__tests__/intl/numberFormat.spec.ts b/packages/web/__tests__/intl/numberFormat.spec.ts
@@ -1,12 +1,17 @@
 import { useIntlNumberFormat } from "../../src";
+import { ref } from "@vue/composition-api";
+import { nextTick } from "../utils";
 
 describe("intl numberFormat", () => {
   const spy = jest.fn();
+  const formatSpy = jest.fn();
 
   class Test {
     constructor(...args: any[]) {
       spy(...args);
     }
+
+    format = formatSpy;
   }
 
   Object.defineProperty(window, "Intl", {
@@ -25,13 +30,80 @@ describe("intl numberFormat", () => {
     }
   });
 
+  beforeEach(() => {
+    spy.mockReset();
+    formatSpy.mockReset();
+  });
+
   it("should call new Intl.NumberFormat with the write options", async () => {
     let locales: string | string[] | undefined = "en-GB";
-    let options: Intl.DateTimeFormatOptions = {};
+    let options: Intl.NumberFormatOptions = {};
     const { formatter } = useIntlNumberFormat(locales, options);
 
     expect(formatter.value).toBeDefined();
-    // expect(Intl.NumberFormat).toHaveBeenCalled();
     expect(spy).toHaveBeenLastCalledWith(locales, options);
   });
+
+  it("should pass arguments", async () => {
+    let locales: string | string[] | undefined = "en-GB";
+    let options: Intl.NumberFormatOptions = {};
+
+    useIntlNumberFormat().formatter.value;
+    expect(spy).toHaveBeenLastCalledWith(undefined, undefined);
+
+    useIntlNumberFormat(locales).formatter.value;
+    expect(spy).toHaveBeenLastCalledWith(locales, undefined);
+
+    useIntlNumberFormat(options).formatter.value;
+    expect(spy).toHaveBeenLastCalledWith(undefined, options);
+
+    useIntlNumberFormat(locales, options).formatter.value;
+    expect(spy).toHaveBeenLastCalledWith(locales, options);
+
+    // reactive
+    spy.mockClear();
+    const l = ref("en-GB");
+    const o = ref<Intl.NumberFormatOptions>();
+    const { formatter } = useIntlNumberFormat(l, o);
+    formatter.value;
+    expect(spy).toHaveBeenLastCalledWith(l.value, o.value);
+
+    l.value = "pt-PT";
+    await nextTick();
+    formatter.value;
+
+    expect(spy).toHaveBeenLastCalledWith(l.value, o.value);
+
+    o.value = { currencyDisplay: "symbol" };
+    await nextTick();
+    formatter.value;
+    expect(spy).toHaveBeenLastCalledWith(l.value, o.value);
+  });
+
+  it("should call formatter.formatString", () => {
+    const { formatString, formatter } = useIntlNumberFormat();
+    formatter.value;
+    expect(spy).toHaveBeenCalled();
+
+    formatString(111);
+    expect(spy).toHaveBeenCalledTimes(1);
+
+    let overrideOpts = { currency: "GBP" };
+    formatString(111, overrideOpts);
+    expect(spy).toHaveBeenCalledTimes(2);
+    expect(spy).toHaveBeenLastCalledWith(undefined, overrideOpts);
+
+    formatString(111, undefined, "pt-PT");
+    expect(spy).toHaveBeenCalledTimes(3);
+    expect(spy).toHaveBeenLastCalledWith("pt-PT", {});
+  });
+
+  test("format()", () => {
+    formatSpy.mockReturnValueOnce("test");
+    const { format } = useIntlNumberFormat();
+
+    expect(format(111)).toMatchObject({
+      value: "test"
+    });
+  });
 });
diff --git a/packages/web/src/intl/_helper.ts b/packages/web/src/intl/_helper.ts
@@ -6,7 +6,7 @@ import {
   isArray,
   isString
 } from "@vue-composable/core";
-import { Ref } from "@vue/composition-api";
+import { Ref, isRef } from "@vue/composition-api";
 
 export function intlDateFormatExtractArguments(
   locales: IntlNumberFormatLocales,
@@ -28,7 +28,7 @@ export function intlDateFormatExtractArguments(
   const wrappedOpts = wrap(opts);
   const wrappedLocalesOptions = wrap(localesOptions);
 
-  return isObject(wrappedOpts.value)
+  return isObject(wrappedOpts.value) || isRef(opts)
     ? [
         wrappedLocalesOptions.value !== undefined
           ? wrappedLocalesOptions

diff --git a/packages/web/src/intl/numberFormat.ts b/packages/web/src/intl/numberFormat.ts
@@ -24,18 +24,32 @@ export interface NumberFormatReturn {
 export function useIntlNumberFormat(): NumberFormatReturn;
 
 export function useIntlNumberFormat(
-  locales: IntlNumberFormatLocales,
-  options?: RefTyped<IntlNumberFormatOptions>
+  locales: IntlNumberFormatLocales
 ): NumberFormatReturn;
+
 export function useIntlNumberFormat(
   options: RefTyped<IntlNumberFormatOptions>
 ): NumberFormatReturn;
+
 export function useIntlNumberFormat(
-  locales: IntlNumberFormatLocales,
   options: RefTyped<Intl.NumberFormatOptions>
 ): NumberFormatReturn;
+
+export function useIntlNumberFormat(
+  locales: IntlNumberFormatLocales,
+  options?: RefTyped<IntlNumberFormatOptions | undefined>
+): NumberFormatReturn;
+
+export function useIntlNumberFormat(
+  locales: IntlNumberFormatLocales,
+  options: RefTyped<Intl.NumberFormatOptions | undefined>
+): NumberFormatReturn;
+
 export function useIntlNumberFormat(
-  localesOptions?: IntlNumberFormatLocales | RefTyped<IntlNumberFormatOptions>,
+  localesOptions?:
+    | IntlNumberFormatLocales
+    | RefTyped<IntlNumberFormatOptions>
+    | RefTyped<Intl.NumberFormatOptions>,
   opts?: any
 ) {
   const [locales, options] = intlDateFormatExtractArguments(
@@ -60,7 +74,7 @@ export function useIntlNumberFormat(
       overrideOpts || overrideLocale
         ? new Intl.NumberFormat(
             unwrap(overrideLocale as RefTyped<string>) ||
-              unwrap(locales as Ref<string | string[]> | undefined),
+              unwrap(locales as Ref<string | string[]>),
             { ...unwrap(options), ...unwrap(overrideOpts) }
           )
         : formatter.value;