LibJS: Implement Intl.DateTimeFormat.prototype.formatToParts

Userland/Libraries/LibJS/Runtime/Intl/DateTimeFormat.cpp

@@ -6,6 +6,7 @@
 
 #include <AK/NumericLimits.h>
 #include <LibJS/Runtime/AbstractOperations.h>
+#include <LibJS/Runtime/Array.h>
 #include <LibJS/Runtime/Date.h>
 #include <LibJS/Runtime/Intl/DateTimeFormat.h>
 #include <LibJS/Runtime/Intl/NumberFormat.h>
@@ -1066,6 +1067,42 @@ ThrowCompletionOr<String> format_date_time(GlobalObject& global_object, DateTime
     return result.build();
 }
 
+// 11.1.10 FormatDateTimeToParts ( dateTimeFormat, x ), https://tc39.es/ecma402/#sec-formatdatetimetoparts
+ThrowCompletionOr<Array*> format_date_time_to_parts(GlobalObject& global_object, DateTimeFormat& date_time_format, Value time)
+{
+    auto& vm = global_object.vm();
+
+    // 1. Let parts be ? PartitionDateTimePattern(dateTimeFormat, x).
+    auto parts = TRY(partition_date_time_pattern(global_object, date_time_format, time));
+
+    // 2. Let result be ArrayCreate(0).
+    auto* result = MUST(Array::create(global_object, 0));
+
+    // 3. Let n be 0.
+    size_t n = 0;
+
+    // 4. For each Record { [[Type]], [[Value]] } part in parts, do
+    for (auto& part : parts) {
+        // a. Let O be OrdinaryObjectCreate(%Object.prototype%).
+        auto* object = Object::create(global_object, global_object.object_prototype());
+
+        // b. Perform ! CreateDataPropertyOrThrow(O, "type", part.[[Type]]).
+        MUST(object->create_data_property_or_throw(vm.names.type, js_string(vm, part.type)));
+
+        // c. Perform ! CreateDataPropertyOrThrow(O, "value", part.[[Value]]).
+        MUST(object->create_data_property_or_throw(vm.names.value, js_string(vm, move(part.value))));
+
+        // d. Perform ! CreateDataProperty(result, ! ToString(n), O).
+        MUST(result->create_data_property_or_throw(n, object));
+
+        // e. Increment n by 1.
+        ++n;
+    }
+
+    // 5. Return result.
+    return result;
+}
+
 // 11.1.14 ToLocalTime ( t, calendar, timeZone ), https://tc39.es/ecma402/#sec-tolocaltime
 ThrowCompletionOr<LocalTime> to_local_time(GlobalObject& global_object, double time, StringView calendar, [[maybe_unused]] StringView time_zone)
 {

Userland/Libraries/LibJS/Runtime/Intl/DateTimeFormat.h

@@ -179,6 +179,7 @@ Optional<Unicode::CalendarPattern> best_fit_format_matcher(Unicode::CalendarPatt
 ThrowCompletionOr<Vector<PatternPartition>> format_date_time_pattern(GlobalObject& global_object, DateTimeFormat& date_time_format, Vector<PatternPartition> pattern_parts, Value time, Value range_format_options);
 ThrowCompletionOr<Vector<PatternPartition>> partition_date_time_pattern(GlobalObject& global_object, DateTimeFormat& date_time_format, Value time);
 ThrowCompletionOr<String> format_date_time(GlobalObject& global_object, DateTimeFormat& date_time_format, Value time);
+ThrowCompletionOr<Array*> format_date_time_to_parts(GlobalObject& global_object, DateTimeFormat& date_time_format, Value time);
 ThrowCompletionOr<LocalTime> to_local_time(GlobalObject& global_object, double time, StringView calendar, StringView time_zone);
 
 template<typename Callback>

Userland/Libraries/LibJS/Runtime/Intl/DateTimeFormatPrototype.cpp

@@ -4,6 +4,8 @@
  * SPDX-License-Identifier: BSD-2-Clause
  */
 
+#include <LibJS/Runtime/AbstractOperations.h>
+#include <LibJS/Runtime/Array.h>
 #include <LibJS/Runtime/GlobalObject.h>
 #include <LibJS/Runtime/Intl/DateTimeFormatFunction.h>
 #include <LibJS/Runtime/Intl/DateTimeFormatPrototype.h>
@@ -29,6 +31,7 @@ void DateTimeFormatPrototype::initialize(GlobalObject& global_object)
     define_native_accessor(vm.names.format, format, nullptr, Attribute::Configurable);
 
     u8 attr = Attribute::Writable | Attribute::Configurable;
+    define_native_function(vm.names.formatToParts, format_to_parts, 1, attr);
     define_native_function(vm.names.resolvedOptions, resolved_options, 0, attr);
 }
 
@@ -55,6 +58,30 @@ JS_DEFINE_NATIVE_FUNCTION(DateTimeFormatPrototype::format)
     return date_time_format->bound_format();
 }
 
+// 11.4.4 Intl.DateTimeFormat.prototype.formatToParts ( date ), https://tc39.es/ecma402/#sec-Intl.DateTimeFormat.prototype.formatToParts
+JS_DEFINE_NATIVE_FUNCTION(DateTimeFormatPrototype::format_to_parts)
+{
+    auto date = vm.argument(0);
+
+    // 1. Let dtf be the this value.
+    // 2. Perform ? RequireInternalSlot(dtf, [[InitializedDateTimeFormat]]).
+    auto* date_time_format = TRY(typed_this_object(global_object));
+
+    // 3. If date is undefined, then
+    if (date.is_undefined()) {
+        // a. Let x be Call(%Date.now%, undefined).
+        date = MUST(call(global_object, global_object.date_constructor_now_function(), js_undefined()));
+    }
+    // 4. Else,
+    else {
+        // a. Let x be ? ToNumber(date).
+        date = TRY(date.to_number(global_object));
+    }
+
+    // 5. Return ? FormatDateTimeToParts(dtf, x).
+    return TRY(format_date_time_to_parts(global_object, *date_time_format, date));
+}
+
 // 11.4.7 Intl.DateTimeFormat.prototype.resolvedOptions ( ), https://tc39.es/ecma402/#sec-intl.datetimeformat.prototype.resolvedoptions
 JS_DEFINE_NATIVE_FUNCTION(DateTimeFormatPrototype::resolved_options)
 {

Userland/Libraries/LibJS/Runtime/Intl/DateTimeFormatPrototype.h

@@ -21,6 +21,7 @@ public:
 
 private:
     JS_DECLARE_NATIVE_FUNCTION(format);
+    JS_DECLARE_NATIVE_FUNCTION(format_to_parts);
     JS_DECLARE_NATIVE_FUNCTION(resolved_options);
 };
 

Userland/Libraries/LibJS/Tests/builtins/Intl/DateTimeFormat/DateTimeFormat.prototype.formatToParts.js

@@ -0,0 +1,279 @@
+describe("errors", () => {
+    test("called on non-DateTimeFormat object", () => {
+        expect(() => {
+            Intl.DateTimeFormat.prototype.formatToParts(1);
+        }).toThrowWithMessage(TypeError, "Not an object of type Intl.DateTimeFormat");
+    });
+
+    test("called with value that cannot be converted to a number", () => {
+        expect(() => {
+            Intl.DateTimeFormat().formatToParts(Symbol.hasInstance);
+        }).toThrowWithMessage(TypeError, "Cannot convert symbol to number");
+
+        expect(() => {
+            Intl.DateTimeFormat().formatToParts(1n);
+        }).toThrowWithMessage(TypeError, "Cannot convert BigInt to number");
+    });
+
+    test("time value cannot be clipped", () => {
+        expect(() => {
+            Intl.DateTimeFormat().formatToParts(NaN);
+        }).toThrowWithMessage(RangeError, "Time value must be between -8.64E15 and 8.64E15");
+
+        expect(() => {
+            Intl.DateTimeFormat().formatToParts(-8.65e15);
+        }).toThrowWithMessage(RangeError, "Time value must be between -8.64E15 and 8.64E15");
+
+        expect(() => {
+            Intl.DateTimeFormat().formatToParts(8.65e15);
+        }).toThrowWithMessage(RangeError, "Time value must be between -8.64E15 and 8.64E15");
+    });
+});
+
+const d = Date.UTC(1989, 0, 23, 7, 8, 9, 45);
+
+describe("dateStyle", () => {
+    test("full", () => {
+        const en = new Intl.DateTimeFormat("en", { dateStyle: "full" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "weekday", value: "Monday" },
+            { type: "literal", value: ", " },
+            { type: "month", value: "January" },
+            { type: "literal", value: " " },
+            { type: "day", value: "23" },
+            { type: "literal", value: ", " },
+            { type: "year", value: "1989" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { dateStyle: "full" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "weekday", value: "الاثنين" },
+            { type: "literal", value: "، " },
+            { type: "day", value: "٢٣" },
+            { type: "literal", value: " " },
+            { type: "month", value: "يناير" },
+            { type: "literal", value: " " },
+            { type: "year", value: "١٩٨٩" },
+        ]);
+    });
+
+    test("long", () => {
+        const en = new Intl.DateTimeFormat("en", { dateStyle: "long" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "month", value: "January" },
+            { type: "literal", value: " " },
+            { type: "day", value: "23" },
+            { type: "literal", value: ", " },
+            { type: "year", value: "1989" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { dateStyle: "long" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "day", value: "٢٣" },
+            { type: "literal", value: " " },
+            { type: "month", value: "يناير" },
+            { type: "literal", value: " " },
+            { type: "year", value: "١٩٨٩" },
+        ]);
+    });
+
+    test("medium", () => {
+        const en = new Intl.DateTimeFormat("en", { dateStyle: "medium" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "month", value: "Jan" },
+            { type: "literal", value: " " },
+            { type: "day", value: "23" },
+            { type: "literal", value: ", " },
+            { type: "year", value: "1989" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { dateStyle: "medium" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "day", value: "٢٣" },
+            { type: "literal", value: "‏/" },
+            { type: "month", value: "٠١" },
+            { type: "literal", value: "‏/" },
+            { type: "year", value: "١٩٨٩" },
+        ]);
+    });
+
+    test("short", () => {
+        const en = new Intl.DateTimeFormat("en", { dateStyle: "short" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "month", value: "1" },
+            { type: "literal", value: "/" },
+            { type: "day", value: "23" },
+            { type: "literal", value: "/" },
+            { type: "year", value: "89" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { dateStyle: "short" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "day", value: "٢٣" },
+            { type: "literal", value: "‏/" },
+            { type: "month", value: "١" },
+            { type: "literal", value: "‏/" },
+            { type: "year", value: "١٩٨٩" },
+        ]);
+    });
+});
+
+describe("timeStyle", () => {
+    test("full", () => {
+        const en = new Intl.DateTimeFormat("en", { timeStyle: "full", timeZone: "UTC" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "hour", value: "7" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "08" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "09" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "AM" },
+            { type: "literal", value: " " },
+            { type: "timeZoneName", value: "Coordinated Universal Time" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { timeStyle: "full", timeZone: "UTC" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "hour", value: "٧" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "٠٨" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "٠٩" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "ص" },
+            { type: "literal", value: " " },
+            { type: "timeZoneName", value: "التوقيت العالمي المنسق" },
+        ]);
+    });
+
+    test("long", () => {
+        const en = new Intl.DateTimeFormat("en", { timeStyle: "long", timeZone: "UTC" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "hour", value: "7" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "08" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "09" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "AM" },
+            { type: "literal", value: " " },
+            { type: "timeZoneName", value: "UTC" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { timeStyle: "long", timeZone: "UTC" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "hour", value: "٧" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "٠٨" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "٠٩" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "ص" },
+            { type: "literal", value: " " },
+            { type: "timeZoneName", value: "UTC" },
+        ]);
+    });
+
+    test("medium", () => {
+        const en = new Intl.DateTimeFormat("en", { timeStyle: "medium", timeZone: "UTC" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "hour", value: "7" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "08" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "09" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "AM" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { timeStyle: "medium", timeZone: "UTC" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "hour", value: "٧" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "٠٨" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "٠٩" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "ص" },
+        ]);
+    });
+
+    test("short", () => {
+        const en = new Intl.DateTimeFormat("en", { timeStyle: "short", timeZone: "UTC" });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "hour", value: "7" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "08" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "AM" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", { timeStyle: "short", timeZone: "UTC" });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "hour", value: "٧" },
+            { type: "literal", value: ":" },
+            { type: "minute", value: "٠٨" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "ص" },
+        ]);
+    });
+});
+
+describe("special cases", () => {
+    test("dayPeriod", () => {
+        const en = new Intl.DateTimeFormat("en", {
+            dayPeriod: "long",
+            hour: "numeric",
+            timeZone: "UTC",
+        });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "hour", value: "7" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "in the morning" },
+        ]);
+
+        // FIXME: The ar format isn't entirely correct. LibUnicode is only parsing e.g. "morning1" in the "dayPeriods"
+        //        CLDR object. It will need to parse "morning2", and figure out how to apply it.
+        const ar = new Intl.DateTimeFormat("ar", {
+            dayPeriod: "long",
+            hour: "numeric",
+            timeZone: "UTC",
+        });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "hour", value: "٧" },
+            { type: "literal", value: " " },
+            { type: "dayPeriod", value: "في الصباح" },
+        ]);
+    });
+
+    test("fractionalSecondDigits", () => {
+        const en = new Intl.DateTimeFormat("en", {
+            fractionalSecondDigits: 3,
+            second: "numeric",
+            minute: "numeric",
+            timeZone: "UTC",
+        });
+        expect(en.formatToParts(d)).toEqual([
+            { type: "minute", value: "08" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "09" },
+            { type: "literal", value: "." },
+            { type: "fractionalSecond", value: "045" },
+        ]);
+
+        const ar = new Intl.DateTimeFormat("ar", {
+            fractionalSecondDigits: 3,
+            second: "numeric",
+            minute: "numeric",
+            timeZone: "UTC",
+        });
+        expect(ar.formatToParts(d)).toEqual([
+            { type: "minute", value: "٠٨" },
+            { type: "literal", value: ":" },
+            { type: "second", value: "٠٩" },
+            { type: "literal", value: "٫" },
+            { type: "fractionalSecond", value: "٠٤٥" },
+        ]);
+    });
+});