From 9b3be31a6bb9a67eb388de907814664643ca3842 Mon Sep 17 00:00:00 2001 From: godzylinux Date: Fri, 24 May 2024 23:10:48 +0330 Subject: [PATCH] added tests for date --- packages/svelte/src/reactivity/date.js | 5 + packages/svelte/src/reactivity/date.test.ts | 587 ++++++++++++++++++++ 2 files changed, 592 insertions(+) create mode 100644 packages/svelte/src/reactivity/date.test.ts diff --git a/packages/svelte/src/reactivity/date.js b/packages/svelte/src/reactivity/date.js index ecb599dca4..f9305157af 100644 --- a/packages/svelte/src/reactivity/date.js +++ b/packages/svelte/src/reactivity/date.js @@ -37,6 +37,11 @@ const notify_datetime_changes = (options, ...params) => { is_date_changed = true; } + if (options.value.getDate() !== new_datetime.getDate()) { + options.notify_read_properties(['getDate', 'getUTCDate']); + is_date_changed = true; + } + if (options.value.getDay() !== new_datetime.getDay()) { options.notify_read_properties(['getDay', 'getUTCDay']); is_date_changed = true; diff --git a/packages/svelte/src/reactivity/date.test.ts b/packages/svelte/src/reactivity/date.test.ts new file mode 100644 index 0000000000..30905f542d --- /dev/null +++ b/packages/svelte/src/reactivity/date.test.ts @@ -0,0 +1,587 @@ +import { render_effect, effect_root } from '../internal/client/reactivity/effects.js'; +import { flushSync } from '../index-client.js'; +import { ReactiveDate } from './date.js'; +import { assert, test } from 'vitest'; + +const initial_date = new ReactiveDate('2023-01-01T00:00:00.000Z'); +const new_dates = [ + new Date('2024-02-02T01:01:01.001Z'), + new Date('2025-03-03T02:02:02.002Z'), + new Date('2026-04-04T03:03:03.003Z') +]; + +test('date.setDate', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getDate()); + }); + }); + + flushSync(() => { + date.setDate(new_dates[0].getDate()); + }); + + flushSync(() => { + date.setDate(new_dates[1].getDate()); + }); + + flushSync(() => { + // nothing should happen here + date.setDate(new_dates[1].getDate()); + }); + + assert.deepEqual(log, [initial_date.getDate(), new_dates[0].getDate(), new_dates[1].getDate()]); + + cleanup(); +}); + +test('date.setFullYear', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getFullYear()); + }); + }); + + flushSync(() => { + date.setFullYear(new_dates[0].getFullYear()); + }); + + flushSync(() => { + date.setFullYear(new_dates[1].getFullYear()); + }); + + flushSync(() => { + // nothing should happen here + date.setFullYear(new_dates[1].getFullYear()); + }); + + assert.deepEqual(log, [ + initial_date.getFullYear(), + new_dates[0].getFullYear(), + new_dates[1].getFullYear() + ]); + + cleanup(); +}); + +test('date.setHours', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getHours()); + }); + }); + + flushSync(() => { + date.setHours(new_dates[0].getHours()); + }); + + flushSync(() => { + date.setHours(new_dates[1].getHours()); + }); + + flushSync(() => { + // nothing should happen here + date.setHours(new_dates[1].getHours()); + }); + + assert.deepEqual(log, [ + initial_date.getHours(), + new_dates[0].getHours(), + new_dates[1].getHours() + ]); + + cleanup(); +}); + +test('date.setMilliseconds', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getMilliseconds()); + }); + }); + + flushSync(() => { + date.setMilliseconds(new_dates[0].getMilliseconds()); + }); + + flushSync(() => { + date.setMilliseconds(new_dates[1].getMilliseconds()); + }); + + flushSync(() => { + // nothing should happen here + date.setMilliseconds(new_dates[1].getMilliseconds()); + }); + + assert.deepEqual(log, [ + initial_date.getMilliseconds(), + new_dates[0].getMilliseconds(), + new_dates[1].getMilliseconds() + ]); + + cleanup(); +}); + +test('date.setMinutes', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getMinutes()); + }); + }); + + flushSync(() => { + date.setMinutes(new_dates[0].getMinutes()); + }); + + flushSync(() => { + date.setMinutes(new_dates[1].getMinutes()); + }); + + flushSync(() => { + // nothing should happen here + date.setMinutes(new_dates[1].getMinutes()); + }); + + assert.deepEqual(log, [ + initial_date.getMinutes(), + new_dates[0].getMinutes(), + new_dates[1].getMinutes() + ]); + + cleanup(); +}); + +test('date.setMonth', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getMonth()); + }); + }); + + flushSync(() => { + date.setMonth(new_dates[0].getMonth()); + }); + + flushSync(() => { + date.setMonth(new_dates[1].getMonth()); + }); + + flushSync(() => { + // nothing should happen here + date.setMonth(new_dates[1].getMonth()); + }); + + assert.deepEqual(log, [ + initial_date.getMonth(), + new_dates[0].getMonth(), + new_dates[1].getMonth() + ]); + + cleanup(); +}); + +test('date.setSeconds', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getSeconds()); + }); + }); + + flushSync(() => { + date.setSeconds(new_dates[0].getSeconds()); + }); + + flushSync(() => { + date.setSeconds(new_dates[1].getSeconds()); + }); + + flushSync(() => { + // nothing should happen here + date.setSeconds(new_dates[1].getSeconds()); + }); + + assert.deepEqual(log, [ + initial_date.getSeconds(), + new_dates[0].getSeconds(), + new_dates[1].getSeconds() + ]); + + cleanup(); +}); + +test('date.setTime', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getTime()); + }); + }); + + flushSync(() => { + date.setTime(new_dates[0].getTime()); + }); + + flushSync(() => { + date.setTime(new_dates[1].getTime()); + }); + + flushSync(() => { + // nothing should happen here + date.setTime(new_dates[1].getTime()); + }); + + assert.deepEqual(log, [initial_date.getTime(), new_dates[0].getTime(), new_dates[1].getTime()]); + + cleanup(); +}); + +test('date.setUTCDate', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getUTCDate()); + }); + }); + + flushSync(() => { + date.setUTCDate(new_dates[0].getUTCDate()); + }); + + flushSync(() => { + date.setUTCDate(new_dates[1].getUTCDate()); + }); + + flushSync(() => { + // nothing should happen here + date.setUTCDate(new_dates[1].getUTCDate()); + }); + + assert.deepEqual(log, [ + initial_date.getUTCDate(), + new_dates[0].getUTCDate(), + new_dates[1].getUTCDate() + ]); + + cleanup(); +}); + +test('date.setUTCFullYear', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getUTCFullYear()); + }); + }); + + flushSync(() => { + date.setUTCFullYear(new_dates[0].getUTCFullYear()); + }); + + flushSync(() => { + date.setUTCFullYear(new_dates[1].getUTCFullYear()); + }); + + flushSync(() => { + // nothing should happen here + date.setUTCFullYear(new_dates[1].getUTCFullYear()); + }); + + assert.deepEqual(log, [ + initial_date.getUTCFullYear(), + new_dates[0].getUTCFullYear(), + new_dates[1].getUTCFullYear() + ]); + + cleanup(); +}); + +test('date.setUTCHours', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getUTCHours()); + }); + }); + + flushSync(() => { + date.setUTCHours(new_dates[0].getUTCHours()); + }); + + flushSync(() => { + date.setUTCHours(new_dates[1].getUTCHours()); + }); + + flushSync(() => { + // nothing should happen here + date.setUTCHours(new_dates[1].getUTCHours()); + }); + + assert.deepEqual(log, [ + initial_date.getUTCHours(), + new_dates[0].getUTCHours(), + new_dates[1].getUTCHours() + ]); + + cleanup(); +}); + +test('date.setUTCMilliseconds', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getUTCMilliseconds()); + }); + }); + + flushSync(() => { + date.setUTCMilliseconds(new_dates[0].getUTCMilliseconds()); + }); + + flushSync(() => { + date.setUTCMilliseconds(new_dates[1].getUTCMilliseconds()); + }); + + flushSync(() => { + // nothing should happen here + date.setUTCMilliseconds(new_dates[1].getUTCMilliseconds()); + }); + + assert.deepEqual(log, [ + initial_date.getUTCMilliseconds(), + new_dates[0].getUTCMilliseconds(), + new_dates[1].getUTCMilliseconds() + ]); + + cleanup(); +}); + +test('date.setUTCMinutes', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getUTCMinutes()); + }); + }); + + flushSync(() => { + date.setUTCMinutes(new_dates[0].getUTCMinutes()); + }); + + flushSync(() => { + date.setUTCMinutes(new_dates[1].getUTCMinutes()); + }); + + flushSync(() => { + // nothing should happen here + date.setUTCMinutes(new_dates[1].getUTCMinutes()); + }); + + assert.deepEqual(log, [ + initial_date.getUTCMinutes(), + new_dates[0].getUTCMinutes(), + new_dates[1].getUTCMinutes() + ]); + + cleanup(); +}); + +test('date.setUTCMonth', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getUTCMonth()); + }); + }); + + flushSync(() => { + date.setUTCMonth(new_dates[0].getUTCMonth()); + }); + + flushSync(() => { + date.setUTCMonth(new_dates[1].getUTCMonth()); + }); + + flushSync(() => { + // nothing should happen here + date.setUTCMonth(new_dates[1].getUTCMonth()); + }); + + assert.deepEqual(log, [ + initial_date.getUTCMonth(), + new_dates[0].getUTCMonth(), + new_dates[1].getUTCMonth() + ]); + + cleanup(); +}); + +test('date.setUTCSeconds', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getUTCSeconds()); + }); + }); + + flushSync(() => { + date.setUTCSeconds(new_dates[0].getUTCSeconds()); + }); + + flushSync(() => { + date.setUTCSeconds(new_dates[1].getUTCSeconds()); + }); + + flushSync(() => { + // nothing should happen here + date.setUTCSeconds(new_dates[1].getUTCSeconds()); + }); + + assert.deepEqual(log, [ + initial_date.getUTCSeconds(), + new_dates[0].getUTCSeconds(), + new_dates[1].getUTCSeconds() + ]); + + cleanup(); +}); + +test('date.setYear', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + // @ts-expect-error + if (!date.setYear) { + return; + } + const cleanup = effect_root(() => { + render_effect(() => { + // @ts-expect-error + log.push(date.getYear()); + }); + }); + + flushSync(() => { + // @ts-expect-error + date.setYear(22); + }); + + flushSync(() => { + // @ts-expect-error + date.setYear(23); + }); + + flushSync(() => { + // nothing should happen here + // @ts-expect-error + date.setYear(23); + }); + + // @ts-expect-error + assert.deepEqual(log, [initial_date.getYear(), 22, 23]); + + cleanup(); +}); + +test('date.setSeconds - edge cases', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getSeconds()); + }); + render_effect(() => { + log.push(date.getMinutes()); + }); + }); + + flushSync(() => { + date.setSeconds(60); + }); + + flushSync(() => { + date.setSeconds(61); + }); + + assert.deepEqual(log, [ + initial_date.getSeconds(), + initial_date.getMinutes(), + initial_date.getMinutes() + 1, + initial_date.getSeconds() + 1, + initial_date.getMinutes() + 2 + ]); + + cleanup(); +}); + +test('ReactiveDate propagated changes', () => { + const date = new ReactiveDate(initial_date); + const log: any = []; + + const cleanup = effect_root(() => { + render_effect(() => { + log.push(date.getSeconds()); + }); + render_effect(() => { + log.push(date.getMonth()); + }); + render_effect(() => { + log.push(date.getFullYear()); + }); + }); + + flushSync(() => { + date.setMonth(13); + }); + + assert.deepEqual(log, [ + initial_date.getSeconds(), + initial_date.getMonth(), + initial_date.getFullYear(), + 1, + 2024 + ]); + + cleanup(); +}); + +test('Date.instanceOf', () => { + assert.equal(new ReactiveDate() instanceof Date, true); +});