refactor: Disable more codes related to calendar swiping feature

motss · Oct 27, 2019 · 909c654 · 909c654
1 parent fef93a5
commit 909c654
Show file tree

Hide file tree

Showing 13 changed files with 191 additions and 189 deletions.
diff --git a/src/app-datepicker-dialog.ts b/src/app-datepicker-dialog.ts
@@ -158,8 +158,8 @@ export class AppDatepickerDialog extends LitElement {
   @property({ type: String })
   public weekLabel: string = '';
 
-  @property({ type: Number })
-  public dragRatio: number = .15;
+  // @property({ type: Number })
+  // public dragRatio: number = .15;
 
   @property({ type: String })
   public dismissLabel: string = 'cancel';
@@ -260,6 +260,7 @@ export class AppDatepickerDialog extends LitElement {
   }
 
   protected render() {
+    // .dragRatio="${this.dragRatio}"
     return html`
     <div class="scrim" @click="${this.close}"></div>
 
@@ -274,7 +275,6 @@ export class AppDatepickerDialog extends LitElement {
       .disabledDates="${this.disabledDates}"
       .landscape="${this.landscape}"
       .locale="${this.locale}"
-      .dragRatio="${this.dragRatio}"
       .startView="${this.startView}"
       .value="${this.value}"
       .weekLabel="${this.weekLabel}"

diff --git a/src/app-datepicker.ts b/src/app-datepicker.ts
@@ -190,7 +190,7 @@ export class AppDatepicker extends LitElement {
       position: relative;
       width: calc(100% * 3);
       padding: 0 0 16px;
-      transform: translate3d(-300px, 0, 0);
+      transform: translate3d(-33%, 0, 0);
       /* will-change: transform; */
       /**
         * NOTE: Required for Pointer Events API to work on touch devices.
@@ -467,8 +467,8 @@ export class AppDatepicker extends LitElement {
   @property({ type: String })
   public weekLabel: string = '';
 
-  @property({ type: Number })
-  public dragRatio: number = .15;
+  // @property({ type: Number })
+  // public dragRatio: number = .15;
 
   @property({ type: Date })
   private _selectedDate: Date;

diff --git a/src/demo/properties.config.ts b/src/demo/properties.config.ts
@@ -95,11 +95,11 @@ const properties: PropertyValue[] = [
     value: 'Wk',
     type: 'string',
   },
-  {
-    name: 'dragRatio',
-    value: .15,
-    type: 'number',
-  },
+  // {
+  //   name: 'dragRatio',
+  //   value: .15,
+  //   type: 'number',
+  // },
 ];
 
 const cssProperties: PropertyValue[] = [

diff --git a/src/test/app-datepicker-dialog/app-datepicker-dialog.spec.ts b/src/test/app-datepicker-dialog/app-datepicker-dialog.spec.ts
@@ -1,7 +1,7 @@
 import './a11y.spec.js';
 import './attributes.spec.js';
 import './custom-events.spec.js';
-import './gestures.spec.js';
+// import './gestures.spec.js';
 import './initial-render.spec.js';
 import './keyboards.spec.js';
 import './properties.spec.js';
diff --git a/src/test/app-datepicker-dialog/attributes.spec.ts b/src/test/app-datepicker-dialog/attributes.spec.ts
@@ -216,16 +216,16 @@ describe(getTestName(name), () => {
       strictEqual(t.elem.weekLabel, newVal, `datepicker's 'weekLabel' not updated`);
     });
 
-    it(`renders with correct 'dragRatio'`, async () => {
-      const newVal = .25;
-      el.setAttribute('dragratio', `${newVal}`);
-      await forceUpdate(el);
+    // it(`renders with correct 'dragRatio'`, async () => {
+    //   const newVal = .25;
+    //   el.setAttribute('dragratio', `${newVal}`);
+    //   await forceUpdate(el);
 
-      strictEqual(el.dragRatio, newVal, `'dragRatio' not updated`);
-      strictEqual(el.getAttribute('dragratio'), `${newVal}`, `'dragratio' attribute not set`);
+    //   strictEqual(el.dragRatio, newVal, `'dragRatio' not updated`);
+    //   strictEqual(el.getAttribute('dragratio'), `${newVal}`, `'dragratio' attribute not set`);
 
-      strictEqual(t.elem.dragRatio, newVal, `datepicker's 'dragRatio' not updated`);
-    });
+    //   strictEqual(t.elem.dragRatio, newVal, `datepicker's 'dragRatio' not updated`);
+    // });
 
   });
 });
diff --git a/src/test/app-datepicker-dialog/custom-events.spec.ts b/src/test/app-datepicker-dialog/custom-events.spec.ts
@@ -232,7 +232,8 @@ describe(getTestName(name), () => {
           Array.isArray(allCalendarTables) && allCalendarTables.length > 0,
           `No calendar table found`);
 
-        const focusedCalendarTableEl = allCalendarTables[1];
+        // const focusedCalendarTableEl = allCalendarTables[1];
+        const focusedCalendarTableEl = allCalendarTables[0];
         isNotNull(focusedCalendarTableEl, `Focused calendar table is null`);
 
         for (let i = 0; i < 2; i += 1) {

diff --git a/src/test/app-datepicker-dialog/initial-render.spec.ts b/src/test/app-datepicker-dialog/initial-render.spec.ts
@@ -27,7 +27,7 @@ const {
   strictEqual,
   isNotNull,
   isAtLeast,
-  isAtMost,
+  // isAtMost,
 } = chai.assert;
 const name = AppDatepickerDialog.is;
 
@@ -122,12 +122,12 @@ describe(getTestName(name), () => {
     it('renders initial content (calendar)', () => {
       const elHTML = getShadowInnerHTML(el);
       const calendarView = t.getDatepickerBodyCalendarView();
-      const allCalendarTables = t.getAllCalendarTables();
+      // const allCalendarTables = t.getAllCalendarTables();
 
       isString(elHTML, 'HTML content is not string');
       isNotNull(calendarView, 'Calendar view not found');
-      isAtLeast(allCalendarTables.length, 1, 'Calender tables not found');
-      isAtMost(allCalendarTables.length, 3, 'Calender tables not found');
+      // isAtLeast(allCalendarTables.length, 1, 'Calender tables not found');
+      // isAtMost(allCalendarTables.length, 3, 'Calender tables not found');
     });
 
     it(`renders today's formatted date`, () => {

diff --git a/src/test/app-datepicker-dialog/properties.spec.ts b/src/test/app-datepicker-dialog/properties.spec.ts
@@ -207,14 +207,14 @@ describe(getTestName(name), () => {
       strictEqual(t.elem.weekLabel, newVal, `datepicker's 'weekLabel' not updated`);
     });
 
-    it(`renders with correct 'dragRatio'`, async () => {
-      const newVal = .25;
-      el.dragRatio = newVal;
-      await forceUpdate(el);
-
-      strictEqual(el.dragRatio, newVal, `'dragRatio' not updated`);
-      strictEqual(t.elem.dragRatio, newVal, `datepicker's 'dragRatio' not updated`);
-    });
+    // it(`renders with correct 'dragRatio'`, async () => {
+    //   const newVal = .25;
+    //   el.dragRatio = newVal;
+    //   await forceUpdate(el);
+
+    //   strictEqual(el.dragRatio, newVal, `'dragRatio' not updated`);
+    //   strictEqual(t.elem.dragRatio, newVal, `datepicker's 'dragRatio' not updated`);
+    // });
 
   });
 });
diff --git a/src/test/app-datepicker/app-datepicker.spec.ts b/src/test/app-datepicker/app-datepicker.spec.ts
@@ -1,7 +1,7 @@
 import './a11y.spec.js';
 import './attributes.spec.js';
 import './custom-events.spec.js';
-import './gestures.spec.js';
+// import './gestures.spec.js';
 import './initial-render.spec.js';
 import './keyboards.spec.js';
 import './properties.spec.js';

diff --git a/src/test/app-datepicker/attributes.spec.ts b/src/test/app-datepicker/attributes.spec.ts
@@ -12,14 +12,14 @@ import {
   defaultLocale,
 } from '../test-config.js';
 import {
-  dragTo,
+  // dragTo,
   forceUpdate,
   getComputedStylePropertyValue,
   getShadowInnerHTML,
   getTestName,
-  OptionsDragTo,
+  // OptionsDragTo,
   queryInit,
-  setupDragPoint,
+  // setupDragPoint,
 } from '../test-helpers.js';
 
 const {
@@ -526,79 +526,79 @@ describe(getTestName(name), () => {
       strictEqual(getShadowInnerHTML(weekLabelEl), 'Wk', `Week label not reset`);
     });
 
-    it(`renders with optional 'dragRatio'`, async () => {
-      strictEqual(el.dragRatio, .15, `Initial 'dragRatio' not matched`);
-      isTrue(!el.hasAttribute('dragratio'), `Initial 'dragratio' attribute set`);
-
-      el.min = date13;
-      el.value = date15;
-      el.setAttribute('dragratio', '.5');
-      await forceUpdate(el);
-
-      strictEqual(el.dragRatio, .5, `'dragRatio' not matched`);
-      strictEqual(el.getAttribute('dragratio'), '.5', `'dragratio' attribute not matched`);
-
-      const btnYearSelectorEl = t.getBtnYearSelector();
-      const btnCalendarSelectorEl = t.getBtnCalendarSelector();
-      const calendarViewFullCalendarEl = t.getCalendarViewFullCalendar();
-
-      strictEqual(
-        getShadowInnerHTML(btnYearSelectorEl),
-        '2020',
-        `First year selector text not matched`);
-      strictEqual(
-        getShadowInnerHTML(btnCalendarSelectorEl),
-        'Wed, Jan 15',
-        `First calendar selector text not matched`);
-
-      const calendarLabel = getShadowInnerHTML(t.getCalendarLabel());
-      /** NOTE: [(Safari 9), (Win10 IE 11), (Others)] */
-      isTrue(
-        ['Jan 2020', 'January, 2020', 'January 2020'].some(n => calendarLabel === n),
-        `First calendar label not matched (${calendarLabel})`);
-
-      const oldStartingPoint = setupDragPoint('left', el);
-      const oldDragOptions: OptionsDragTo = { ...oldStartingPoint, dx: -50 };
-      await dragTo(calendarViewFullCalendarEl, oldDragOptions);
-      await t.waitForDragAnimationFinished();
-
-      strictEqual(
-        getShadowInnerHTML(btnYearSelectorEl),
-        '2020',
-        `Year selector text should not change`);
-      strictEqual(
-        getShadowInnerHTML(btnCalendarSelectorEl),
-        'Wed, Jan 15',
-        `Calendar selector text should not change`);
-
-      const oldCalendarLabel = getShadowInnerHTML(t.getCalendarLabel());
-      /** NOTE: [(Safari 9), (Win10 IE 11), (Others)] */
-      isTrue(
-        ['Jan 2020', 'January, 2020', 'January 2020'].some(n => oldCalendarLabel === n),
-        `Calendar label should not update (${oldCalendarLabel})`);
-
-      const startingPoint = setupDragPoint('left', el);
-      const dragOptions: OptionsDragTo = { ...startingPoint, dx: -160 };
-      await dragTo(calendarViewFullCalendarEl, dragOptions);
-      await t.waitForDragAnimationFinished();
-
-      strictEqual(
-        getShadowInnerHTML(btnYearSelectorEl),
-        '2020',
-        `Year selector text should not change`);
-      strictEqual(
-        getShadowInnerHTML(btnCalendarSelectorEl),
-        'Wed, Jan 15',
-        `Calendar selector text should not change`);
-
-      const newCalendarLabel = getShadowInnerHTML(t.getCalendarLabel());
-      /** NOTE: [(Safari 9), (Win10 IE 11), (Others)] */
-      isTrue(
-        ['Feb 2020', 'February, 2020', 'February 2020'].some(n => newCalendarLabel === n),
-        `New calendar label not updated (${newCalendarLabel})`);
-    });
-
-    it(`renders with different 'firstDayofWeek' and 'disabledDays'`, async () => {
+    // it(`renders with optional 'dragRatio'`, async () => {
+    //   strictEqual(el.dragRatio, .15, `Initial 'dragRatio' not matched`);
+    //   isTrue(!el.hasAttribute('dragratio'), `Initial 'dragratio' attribute set`);
+
+    //   el.min = date13;
+    //   el.value = date15;
+    //   el.setAttribute('dragratio', '.5');
+    //   await forceUpdate(el);
+
+    //   strictEqual(el.dragRatio, .5, `'dragRatio' not matched`);
+    //   strictEqual(el.getAttribute('dragratio'), '.5', `'dragratio' attribute not matched`);
+
+    //   const btnYearSelectorEl = t.getBtnYearSelector();
+    //   const btnCalendarSelectorEl = t.getBtnCalendarSelector();
+    //   const calendarViewFullCalendarEl = t.getCalendarViewFullCalendar();
+
+    //   strictEqual(
+    //     getShadowInnerHTML(btnYearSelectorEl),
+    //     '2020',
+    //     `First year selector text not matched`);
+    //   strictEqual(
+    //     getShadowInnerHTML(btnCalendarSelectorEl),
+    //     'Wed, Jan 15',
+    //     `First calendar selector text not matched`);
+
+    //   const calendarLabel = getShadowInnerHTML(t.getCalendarLabel());
+    //   /** NOTE: [(Safari 9), (Win10 IE 11), (Others)] */
+    //   isTrue(
+    //     ['Jan 2020', 'January, 2020', 'January 2020'].some(n => calendarLabel === n),
+    //     `First calendar label not matched (${calendarLabel})`);
+
+    //   const oldStartingPoint = setupDragPoint('left', el);
+    //   const oldDragOptions: OptionsDragTo = { ...oldStartingPoint, dx: -50 };
+    //   await dragTo(calendarViewFullCalendarEl, oldDragOptions);
+    //   await t.waitForDragAnimationFinished();
+
+    //   strictEqual(
+    //     getShadowInnerHTML(btnYearSelectorEl),
+    //     '2020',
+    //     `Year selector text should not change`);
+    //   strictEqual(
+    //     getShadowInnerHTML(btnCalendarSelectorEl),
+    //     'Wed, Jan 15',
+    //     `Calendar selector text should not change`);
+
+    //   const oldCalendarLabel = getShadowInnerHTML(t.getCalendarLabel());
+    //   /** NOTE: [(Safari 9), (Win10 IE 11), (Others)] */
+    //   isTrue(
+    //     ['Jan 2020', 'January, 2020', 'January 2020'].some(n => oldCalendarLabel === n),
+    //     `Calendar label should not update (${oldCalendarLabel})`);
+
+    //   const startingPoint = setupDragPoint('left', el);
+    //   const dragOptions: OptionsDragTo = { ...startingPoint, dx: -160 };
+    //   await dragTo(calendarViewFullCalendarEl, dragOptions);
+    //   await t.waitForDragAnimationFinished();
+
+    //   strictEqual(
+    //     getShadowInnerHTML(btnYearSelectorEl),
+    //     '2020',
+    //     `Year selector text should not change`);
+    //   strictEqual(
+    //     getShadowInnerHTML(btnCalendarSelectorEl),
+    //     'Wed, Jan 15',
+    //     `Calendar selector text should not change`);
+
+    //   const newCalendarLabel = getShadowInnerHTML(t.getCalendarLabel());
+    //   /** NOTE: [(Safari 9), (Win10 IE 11), (Others)] */
+    //   isTrue(
+    //     ['Feb 2020', 'February, 2020', 'February 2020'].some(n => newCalendarLabel === n),
+    //     `New calendar label not updated (${newCalendarLabel})`);
+    // });
+
+    it(`renders with different 'firstDayOfWeek' and 'disabledDays'`, async () => {
       strictEqual(el.firstDayOfWeek, 0, `'firstDayOfWeek' not matched`);
       strictEqual(el.disabledDays, '', `'disabledDays' not matched`);
 

diff --git a/src/test/app-datepicker/custom-events.spec.ts b/src/test/app-datepicker/custom-events.spec.ts
@@ -182,7 +182,8 @@ describe(getTestName(name), () => {
           Array.isArray(allCalendarTables) && allCalendarTables.length > 0,
           `No calendar table found`);
 
-        const focusedCalendarTableEl = allCalendarTables[1];
+        // const focusedCalendarTableEl = allCalendarTables[1];
+        const focusedCalendarTableEl = allCalendarTables[0];
         isNotNull(focusedCalendarTableEl, `Focused calendar table is null`);
 
         for (let i = 0; i < 2; i += 1) {

diff --git a/src/test/app-datepicker/initial-render.spec.ts b/src/test/app-datepicker/initial-render.spec.ts
@@ -24,7 +24,7 @@ const {
   strictEqual,
   isNotNull,
   isAtLeast,
-  isAtMost,
+  // isAtMost,
 } = chai.assert;
 const name = AppDatepicker.is;
 
@@ -56,12 +56,12 @@ describe(getTestName(name), () => {
       it('renders initial content (calendar)', () => {
         const elHTML = getShadowInnerHTML(el);
         const calendarView = t.getDatepickerBodyCalendarView();
-        const allCalendarTables = t.getAllCalendarTables();
+        // const allCalendarTables = t.getAllCalendarTables();
 
         isString(elHTML, 'HTML content is not string');
         isNotNull(calendarView, 'Calendar view not found');
-        isAtLeast(allCalendarTables.length, 1, 'Calender tables not found');
-        isAtMost(allCalendarTables.length, 3, 'Calender tables not found');
+        // isAtLeast(allCalendarTables.length, 1, 'Calender tables not found');
+        // isAtMost(allCalendarTables.length, 3, 'Calender tables not found');
       });
 
       it(`renders today's formatted date`, () => {