From 7e0765adb04b4d642d78084b099addbc9c0733df Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net>
Date: Tue, 12 Sep 2023 15:32:11 +0200
Subject: [PATCH] tests: Date time picker tests
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Julius Härtl <jus@bitgrid.net>
---
 cypress/e2e/cardFeatures.js             | 41 +++++++++++++++++++++++++
 src/components/card/DueDateSelector.vue | 12 ++++++--
 2 files changed, 51 insertions(+), 2 deletions(-)

diff --git a/cypress/e2e/cardFeatures.js b/cypress/e2e/cardFeatures.js
index 6bad048d9..135fc5722 100644
--- a/cypress/e2e/cardFeatures.js
+++ b/cypress/e2e/cardFeatures.js
@@ -1,5 +1,6 @@
 import { randUser } from '../utils/index.js'
 import { sampleBoard } from '../utils/sampleBoard'
+import moment from '@nextcloud/moment'
 
 const user = randUser()
 const boardData = sampleBoard()
@@ -177,6 +178,46 @@ describe('Card', function() {
 			cy.get('#app-sidebar-vue')
 				.find('.ProseMirror h1').contains('Hello world writing more text').should('be.visible')
 		})
+
+		it('Set a due date', function() {
+			const newCardTitle = 'Card with a due date'
+
+			cy.get('.button-vue[aria-label*="Add card"]')
+				.first().click()
+			cy.get('.stack__card-add form input#new-stack-input-main')
+				.type(newCardTitle)
+			cy.get('.stack__card-add form input[type=submit]')
+				.first().click()
+			cy.get(`.card:contains("${newCardTitle}")`).should('be.visible')
+
+			cy.get('.card:contains("Card with a due date")').should('be.visible').click()
+
+			cy.get('#app-sidebar-vue [data-cy-due-date-actions]').should('be.visible').click()
+
+			// Set a due date through shortcut
+			cy.get('[data-cy-due-date-shortcut="tomorrow"] button').should('be.visible').click()
+
+			const tomorrow = moment().add(1, 'days').hour(8).minutes(0).seconds(0)
+			cy.get('#card-duedate-picker').should('have.value', tomorrow.format('YYYY-MM-DDTHH:mm'))
+
+			const now = moment().hour(11).minutes(0).seconds(0).toDate()
+			cy.clock(now)
+			cy.log(now)
+			cy.tick(60_000)
+
+			cy.get(`.card:contains("${newCardTitle}")`).find('[data-due-state="Now"]').should('be.visible').should('contain', '21 hours')
+
+
+			// Remove the due date again
+			cy.get('#app-sidebar-vue [data-cy-due-date-actions]').should('be.visible').click()
+			// tick needed to show the popover menu
+			cy.tick(1_000)
+			cy.get('[data-cy-due-date-remove] button').should('be.visible').click()
+
+			cy.get(`.card:contains("${newCardTitle}")`).find('[data-due-state]').should('not.be.visible')
+
+		})
+
 	})
 
 })
diff --git a/src/components/card/DueDateSelector.vue b/src/components/card/DueDateSelector.vue
index 23b749162..dfdd56671 100644
--- a/src/components/card/DueDateSelector.vue
+++ b/src/components/card/DueDateSelector.vue
@@ -10,19 +10,26 @@
 				:placeholder="t('deck', 'Set a due date')"
 				:hide-label="true"
 				type="datetime-local" />
-			<NcActions v-if="canEdit" :menu-title="!duedate ? t('deck', 'Add due date') : null" type="tertiary">
+			<NcActions v-if="canEdit"
+				:menu-title="!duedate ? t('deck', 'Add due date') : null"
+				type="tertiary"
+				data-cy-due-date-actions>
 				<template v-if="!duedate" #icon>
 					<Plus :size="20" />
 				</template>
 				<NcActionButton v-for="shortcut in reminderOptions"
 					:key="shortcut.key"
 					close-after-click
+					:data-cy-due-date-shortcut="shortcut.key"
 					@click="() => selectShortcut(shortcut)">
 					{{ shortcut.label }}
 				</NcActionButton>
 				<NcActionSeparator />
 
-				<NcActionButton v-if="!duedate" close-after-click @click="initDate">
+				<NcActionButton v-if="!duedate"
+					close-after-click
+					data-cy-due-date-pick
+					@click="initDate">
 					<template #icon>
 						<Plus :size="20" />
 					</template>
@@ -31,6 +38,7 @@
 				<NcActionButton v-else
 					icon="icon-delete"
 					close-after-click
+					data-cy-due-date-remove
 					@click="removeDue">
 					{{ t('deck', 'Remove due date') }}
 				</NcActionButton>