Skip to content

Commit

Permalink
test: fix date tests (#954)
Browse files Browse the repository at this point in the history
  • Loading branch information
@mlmoravek
mlmoravek authored Jun 12, 2024
1 parent 3871879 commit 5f8d324
Show file tree
Hide file tree
Showing 6 changed files with 120 additions and 107 deletions.
6 changes: 0 additions & 6 deletions packages/oruga/src/components/datepicker/DatepickerTableRow.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -314,12 +314,6 @@ function cellClasses(day: Date): ClassBind[] {
datepicker.value.nearbySelectableMonthDays &&
day.getMonth() !== props.month,
],
[
"tableCellTodayClass",
"o-dpck__table__cell--today",
null,
dateMatch(day, datepicker.value.dateCreator()),
],
);
return [
Expand Down
90 changes: 46 additions & 44 deletions packages/oruga/src/components/datepicker/tests/__snapshots__/datepicker.test.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,31 +68,6 @@ exports[`ODatepicker > render correctly 1`] = `
<!--
@slot Override the options, default is options prop
-->
<option value="2034">2034</option>
<option value="2033">2033</option>
<option value="2032">2032</option>
<option value="2031">2031</option>
<option value="2030">2030</option>
<option value="2029">2029</option>
<option value="2028">2028</option>
<option value="2027">2027</option>
<option value="2026">2026</option>
<option value="2025">2025</option>
<option value="2024">2024</option>
<option value="2023">2023</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
Expand Down Expand Up @@ -179,6 +154,31 @@ exports[`ODatepicker > render correctly 1`] = `
<option value="1926">1926</option>
<option value="1925">1925</option>
<option value="1924">1924</option>
<option value="1923">1923</option>
<option value="1922">1922</option>
<option value="1921">1921</option>
<option value="1920">1920</option>
<option value="1919">1919</option>
<option value="1918">1918</option>
<option value="1917">1917</option>
<option value="1916">1916</option>
<option value="1915">1915</option>
<option value="1914">1914</option>
<option value="1913">1913</option>
<option value="1912">1912</option>
<option value="1911">1911</option>
<option value="1910">1910</option>
<option value="1909">1909</option>
<option value="1908">1908</option>
<option value="1907">1907</option>
<option value="1906">1906</option>
<option value="1905">1905</option>
<option value="1904">1904</option>
<option value="1903">1903</option>
<option value="1902">1902</option>
<option value="1901">1901</option>
<option value="1900">1900</option>
<option value="1899">1899</option>
</select>
<!--v-if-->
</div>
Expand All @@ -198,18 +198,12 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__body">
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>26</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>27</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>28</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>29</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>30</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>31</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>1</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>2</span>
<!--v-if-->
</div>
Expand All @@ -219,6 +213,9 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>4</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>5</span>
<!--v-if-->
</div>
Expand All @@ -231,18 +228,18 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>8</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>9</span>
<!--v-if-->
</div>
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>10</span>
<!--v-if-->
</div>
<div class="o-dpck__table__cell o-dpck__table__cell--today o-dpck__table__cell--selectable o-dpck__table__cell--today" role="button"><span>11</span>
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>11</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>12</span>
<!--v-if-->
</div>
Expand All @@ -255,9 +252,6 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>15</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>16</span>
<!--v-if-->
</div>
Expand All @@ -267,6 +261,9 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>18</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>19</span>
<!--v-if-->
</div>
Expand All @@ -279,9 +276,6 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>22</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>23</span>
<!--v-if-->
</div>
Expand All @@ -291,6 +285,9 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>25</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>26</span>
<!--v-if-->
</div>
Expand All @@ -303,18 +300,23 @@ exports[`ODatepicker > render correctly 1`] = `
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>29</span>
<!--v-if-->
</div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--selectable" role="button" tabindex="0"><span>30</span>
<!--v-if-->
</div>
<div class="o-dpck__table__cell o-dpck__table__cell--today o-dpck__table__cell--selectable" role="button"><span>31</span>
<!--v-if-->
</div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>1</span></div>
</div>
<div class="o-dpck__table__row">
<!--v-if-->
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>2</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>3</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>4</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>5</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>6</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>7</span></div>
<div class="o-dpck__table__cell o-dpck__table__cell--unselectable"><span>8</span></div>
</div>
</div>
</section>
Expand Down
11 changes: 10 additions & 1 deletion packages/oruga/src/components/datepicker/tests/datepicker.test.ts
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,20 @@
import { afterEach, describe, expect, test } from "vitest";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
import { mount, enableAutoUnmount } from "@vue/test-utils";

import ODatepicker from "@/components/datepicker/Datepicker.vue";

describe("ODatepicker", () => {
enableAutoUnmount(afterEach);

beforeEach(() => {
vi.useFakeTimers();
vi.setSystemTime(new Date(2000, 0, 0));
});

afterEach(() => {
vi.useRealTimers();
});

test("render correctly", () => {
const wrapper = mount(ODatepicker);
expect(!!wrapper.vm).toBeTruthy();
Expand Down
19 changes: 8 additions & 11 deletions packages/oruga/src/components/datepicker/utils.ts
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,3 @@
/**
* Return month names according to a specified locale
* @param {String} locale A bcp47 localerouter. undefined will use the user browser locale
* @param {String} format long (ex. March), short (ex. Mar) or narrow (M)
* @return {Array<String>} An array of month names
*/
type MonthType =
| "numeric"
| "2-digit"
Expand All @@ -12,6 +6,12 @@ type MonthType =
| "narrow"
| undefined;

/**
* Return month names according to a specified locale
* @param {String} locale A bcp47 localerouter. undefined will use the user browser locale
* @param {String} format long (ex. March), short (ex. Mar) or narrow (M)
* @return {Array<String>} An array of month names
*/
export function getMonthNames(
locale: string = undefined,
format: MonthType = "long",
Expand All @@ -22,21 +22,19 @@ export function getMonthNames(
}
const dtf = new Intl.DateTimeFormat(locale, {
month: format,
// timeZone: 'UTC'
});
return dates.map((d) => dtf.format(d));
}

type WeekdayType = "long" | "short" | "narrow" | undefined;

/**
* Return weekday names according to a specified locale
* @param {String} locale A bcp47 localerouter. undefined will use the user browser locale
* @param {Number} first day of week index
* @param {String} format long (ex. Thursday), short (ex. Thu) or narrow (T)
* @return {Array<String>} An array of weekday names
*/

type WeekdayType = "long" | "short" | "narrow" | undefined;

export function getWeekdayNames(
locale: string = undefined,
firstDayOfWeek: number = 0,
Expand All @@ -53,7 +51,6 @@ export function getWeekdayNames(
}
const dtf = new Intl.DateTimeFormat(locale, {
weekday: format,
// timeZone: 'UTC'
});
return dates.map((d) => dtf.format(d));
}
Expand Down
Loading

0 comments on commit 5f8d324

Please sign in to comment.