Skip to content

Commit

Permalink
Merge branch 'refs/heads/master' into feature/IVYPORTAL-17540-Impleme…
Browse files Browse the repository at this point in the history
…nt-column-width-changing-for-portal-widgets-LE

# Conflicts:
#	AxonIvyPortal/portal-selenium-test/resources/js/document-screenshot.js
  • Loading branch information
lndanh-axonivy committed Oct 17, 2024
2 parents 6e5fc3e + bba53f4 commit 7d2195e
Show file tree
Hide file tree
Showing 30 changed files with 828 additions and 6 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -58,4 +58,16 @@

.red-topbottomright-medium-border {
border-left: 0;
}
}

.black-medium-outline {
outline-style: solid !important;
outline-color: black !important;
outline-width: medium !important;
}

.black-thin-outline {
outline-style: solid;
outline-color: black;
outline-width: thin;
}
Original file line number Diff line number Diff line change
Expand Up @@ -543,3 +543,15 @@ function removeHighlightShowFilterButton() {
function highlightQuickSearchTextbox() {
createRedMediumOutline($(".widget__header .widget-header-quick-search > form"));
}

function createBlackThinOutline($element) {
$element.addClass("black-thin-outline");
}

function createBlackMediumOutline($element) {
$element.addClass("black-medium-outline");
}

function highlightElement(elementSelector) {
createRedMediumOutline($(elementSelector));
}
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,8 @@
}
],
"layout": {
"w": 9,
"h": 4,
"w": 10,
"h": 6,
"x": 0,
"y": 4
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,8 @@
}
],
"layout": {
"w": 9,
"h": 4,
"w": 10,
"h": 6,
"x": 0,
"y": 4
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@ public class ScreenshotUtils {
public static final String DASHBOARD_CONFIGURATION_FOLDER = "/dashboard-configuration/";
public static final String NOTIFICATION_FOLDER = "/notification/";
public static final String MOBILE_FOLDER = "/mobile/";
public static final String ACCESSIBILITY_DASHBOARD_FOLDER = "/accessibility/";

@PostConstruct
public void initFolder() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,11 @@ public void screenshotDashboardConfigurationUserGuide() throws IOException {
dashboardConfigurationPage.openCreatePublicDashboardMenu();
ScreenshotUtils.captureElementWithMarginOptionScreenshot(dashboardConfigurationPage.getDashboardTemplates(),
ScreenshotUtils.DASHBOARD_CONFIGURATION_FOLDER + "dashboard-templates", new ScreenshotMargin(10));
// screenshot highlight for accessibility template
ScreenshotUtils.resizeBrowser(new Dimension(1920, 1080));
ScreenshotUtils.executeDecorateJs("createBlackMediumOutline($($('.dashboard-action-container')[4]));");
ScreenshotUtils.captureElementWithMarginOptionScreenshot(dashboardConfigurationPage.getDashboardTemplates(),
ScreenshotUtils.ACCESSIBILITY_DASHBOARD_FOLDER + "accessibility-dashboard-creation", new ScreenshotMargin(10));
dashboardConfigurationPage.openImportPublicDashboards();
ScreenshotUtils.captureElementWithMarginOptionScreenshot(dashboardConfigurationPage.getImportDialog(),
ScreenshotUtils.DASHBOARD_CONFIGURATION_FOLDER + "import-public-dashboard-dialog", new ScreenshotMargin(10));
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,11 +33,15 @@
import com.axonivy.portal.selenium.page.ProcessEditWidgetNewDashBoardPage;
import com.axonivy.portal.selenium.page.ProcessViewerWidgetNewDashBoardPage;
import com.axonivy.portal.selenium.page.TaskEditWidgetNewDashBoardPage;
import com.axonivy.portal.selenium.page.TaskTemplatePage;
import com.axonivy.portal.selenium.page.TaskWidgetNewDashBoardPage;
import com.axonivy.portal.selenium.page.WelcomeEditWidgetNewDashboardPage;
import com.axonivy.portal.selenium.util.ConfigurationJsonUtils;
import com.codeborne.selenide.CollectionCondition;
import com.codeborne.selenide.Condition;
import com.codeborne.selenide.SelenideElement;
import static com.codeborne.selenide.CollectionCondition.sizeGreaterThanOrEqual;
import static com.codeborne.selenide.Selenide.$;

import ch.ivy.addon.portalkit.enums.PortalVariable;

Expand Down Expand Up @@ -523,6 +527,68 @@ public void screenshotFilterExample() throws IOException {
ScreenshotUtils.captureElementWithMarginOptionScreenshot(caseWidget.getConfigurationFilter(),
ScreenshotUtils.NEW_DASHBOARD_FOLDER + "complex-filter-example", new ScreenshotMargin(10));
}

@Test
public void screenshotForQuickSearchConfigurationOnTaskWidget() throws IOException {
ConfigurationJsonUtils.updateJSONSetting("dashboard-task-widget-has-quicksearch.json", Variable.DASHBOARD);
login(TestAccount.ADMIN_USER);
redirectToNewDashBoard();
NewDashboardPage newDashboardPage = new NewDashboardPage();
newDashboardPage.waitForTaskWidgetLoaded();
newDashboardPage.clickOnFirstTaskAction();
ScreenshotUtils.executeDecorateJs("createBlackMediumOutline($($('.task-action-item-label')[0]));");
ScreenshotUtils.captureElementWithMarginOptionScreenshot($(".dashboard__widget").shouldBe(Condition.appear, DEFAULT_TIMEOUT),
ScreenshotUtils.ACCESSIBILITY_DASHBOARD_FOLDER + "task-actions-popup",
new ScreenshotMargin(20, 20, 20, 120));
}

@Test
public void screenshotForQuickSearchConfigurationOnCasaWidget() throws IOException {
ConfigurationJsonUtils.updateJSONSetting("dashboard-case-widget-has-quicksearch.json", Variable.DASHBOARD);
login(TestAccount.ADMIN_USER);
redirectToNewDashBoard();
NewDashboardPage newDashboardPage = new NewDashboardPage();
newDashboardPage.waitForCaseWidgetLoaded();
newDashboardPage.clickOnFirstCaseAction();
ScreenshotUtils.executeDecorateJs("createBlackMediumOutline($($('.task-action-item-label')[0]));");
ScreenshotUtils.captureElementWithMarginOptionScreenshot($(".dashboard__widget").shouldBe(Condition.appear, DEFAULT_TIMEOUT),
ScreenshotUtils.ACCESSIBILITY_DASHBOARD_FOLDER + "case-actions-popup",
new ScreenshotMargin(20, 20, 20, 120));
}

@Test
public void screenshotActionWarningDialogWhenStartTask() throws IOException {
ConfigurationJsonUtils.updateJSONSetting("dashboard-task-widget-has-quicksearch.json", Variable.DASHBOARD);
login(TestAccount.ADMIN_USER);
redirectToNewDashBoard();
NewDashboardPage newDashboardPage = new NewDashboardPage();
newDashboardPage.waitForTaskWidgetLoaded();
String taskName = "Sick Leave Request";
TaskWidgetNewDashBoardPage taskWidget = new TaskWidgetNewDashBoardPage();
taskWidget.expand().shouldHave(sizeGreaterThanOrEqual(1));
taskWidget.openFilterWidget();
taskWidget.resetFilter();
taskWidget.openFilterWidget();
taskWidget.filterTaskName(taskName, FilterOperator.IS);
taskWidget.applyFilter();

newDashboardPage = new NewDashboardPage();
newDashboardPage.startTask(0);
TaskTemplatePage taskIframePage = new TaskTemplatePage();
taskIframePage.switchToIFrameOfTask();
taskIframePage.clickCancelAndLeftButton();
taskIframePage.switchBackToParent();

newDashboardPage = new NewDashboardPage();
newDashboardPage.waitForTaskWidgetLoaded();
newDashboardPage.startTask(0);
newDashboardPage.focusOnWarningResetTaskDialog();
ScreenshotUtils.executeDecorateJs("createBlackThinOutline($(\"[id$=':reset-task-confirmation-dialog']\").find('a'));");
ScreenshotUtils.captureElementWithMarginOptionScreenshot($("[id$='reset-task-confirmation-dialog']").shouldBe(Condition.appear, DEFAULT_TIMEOUT),
ScreenshotUtils.ACCESSIBILITY_DASHBOARD_FOLDER + "reset-task-dialog",
new ScreenshotMargin(20, 20, 20, 20));
}


private void redirectToDashboardConfiguration() {
redirectToRelativeLink("portal/1549F58C18A6C562/PortalDashboardConfiguration.ivp");
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -63,4 +63,9 @@ public void waitDocumentReady() {
.until((ExpectedCondition<Boolean>) wd -> ((JavascriptExecutor) wd).executeScript("return document.readyState")
.equals("complete"));
}

public void focusByJavascript(SelenideElement element) {
((JavascriptExecutor) WebDriverRunner.getWebDriver()).executeScript("arguments[0].focus();", element);
}

}
Original file line number Diff line number Diff line change
Expand Up @@ -236,4 +236,9 @@ public void editWidgetById(int id) {
public void scrollToStatistic() {
$(byText("Statistic Widgets")).shouldBe(Condition.appear, DEFAULT_TIMEOUT).scrollIntoView("{block: \"start\", inline: \"start\"}");
}

public SelenideElement getAccessibilityWidget() {
return $("[id^='id-custom-widget-iframe']").shouldBe(Condition.appear, DEFAULT_TIMEOUT);
}

}
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.By.ByCssSelector;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.Keys;
import org.openqa.selenium.WebDriver;
Expand Down Expand Up @@ -1109,4 +1108,33 @@ public void waitForProcessWidgetLoaded() {
checkDisplayedCompactModeProcessContainer();
getProcessWidgetTable().shouldBe(Condition.appear, DEFAULT_TIMEOUT);
}

public void clickOnFirstTaskAction() {
$$("[id$='dashboard-task-side-steps-menu']")
.get(0).shouldBe(getClickableCondition(), DEFAULT_TIMEOUT)
.click();

$("[id$='dashboard-actions-task-task_1:side-steps-panel']")
.shouldBe(appear, DEFAULT_TIMEOUT);
focusByJavascript($("[id$=':task-open-detail-command']"));
$("[id$=':task-open-detail-command']").sendKeys(Keys.TAB);
}

public void clickOnFirstCaseAction() {
$$("[id$='dashboard-case-side-steps-menu']")
.get(0).shouldBe(getClickableCondition(), DEFAULT_TIMEOUT)
.click();

$("[id$=':action-steps-panel']")
.shouldBe(appear, DEFAULT_TIMEOUT);
focusByJavascript($("[id$=':case-item-open-detail-link']"));
$("[id$=':case-item-open-detail-link']").sendKeys(Keys.TAB);
}

public void focusOnWarningResetTaskDialog() {
$("[id$=':reset-task-confirmation-dialog']").shouldBe(appear, DEFAULT_TIMEOUT);
SelenideElement element = $("[id$=':reset-task-confirmation-dialog']").$("a");
focusByJavascript(element);
element.pressTab();
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -466,4 +466,25 @@ public void testImportPublicDashboard() {

configurationPage.saveImportDashboard(name, newGermanName, description, icon);
}

@Test
public void testAddNewAcccessibilityDashboard() {
String name = "Accessibility shortcuts dashboard";
String icon = "fa-coffee";
String description = "Accessibility shortcuts dashboard description";
List<String> permissions = Arrays.asList("Cost Object (CostObject)");
LinkNavigator.redirectToPortalDashboardConfiguration();
var configurationPage = new DashboardConfigurationPage();
configurationPage.openCreatePublicDashboardMenu();
configurationPage.createPublicDashboardFromTemplate(name, icon, description, permissions, 2);

NewDashboardDetailsEditPage newDashboardDetailsEditPage = new NewDashboardDetailsEditPage();
newDashboardDetailsEditPage.getTitleByIndex(0).shouldBe(Condition.exactText(name));
newDashboardDetailsEditPage.getIconByIndex(0, icon).shouldBe(Condition.appear);
assertEquals( newDashboardDetailsEditPage.getWidgets().size(), 4);

SelenideElement element = newDashboardDetailsEditPage.getAccessibilityWidget();
assertEquals(element.getAttribute("title"), "Accessibility Shortcuts frame");
}

}
12 changes: 12 additions & 0 deletions AxonIvyPortal/portal/cms/cms_de.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,8 @@ ch.ivy.addon.portalkit.ui.jsf:
nextAbsence: Bevorstehende Abwesenheit
selectedDeputyFor: Ausgewählter Benutzer ist Stellvertreter für
selectedUser: Ausgewählter Benutzer
AccessibilityShortcuts:
processName: Barrierefreiheit Kürzel Widgets
AllTasks:
caseDescription: Beschreibung des Vorgangs
taskDescription: Aufgabenbeschreibung
Expand Down Expand Up @@ -1332,6 +1334,16 @@ Dialogs:
LinkCopied: Link kopiert
dashboard:
component:
AccessibilityShortcuts:
content: "<div class=\"ui-g\">\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 1</span>Fokus auf die Dashboards\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 4</span>Fokus auf die Fälle\n </div>\n\
\ <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + A</span>Fokus auf den ersten Prozess\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Tab</span>Sequentielles Durchlaufen von Elementen\n </div>\n <div\
\ class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 2</span>Fokus auf die Prozesse\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 5</span>Fokus auf die Suche\n </div>\n <div class=\"ui-g-3 shortcut-content\
\ \">\n <span class=\"shortcut-key\">Alt + W</span>Fokus auf die erste Aufgabe\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Esc</span>Erweiterte Widgets schließen/Kontext Menüs schließen\n </div>\n <div class=\"ui-g-3 shortcut-content\
\ \">\n <span class=\"shortcut-key\">Alt + 3</span>Fokus auf die Aufgaben\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 6</span>Fokus auf die User Einstellungen\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span\
\ class=\"shortcut-key\">Alt + Q</span>Fokus auf den ersten Fall\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Enter</span>Auswahl bestätigen \n </div>\n</div>"
title: 'Barrierefreiheitskürzel. Alt + 1: Se focaliser sur l’onglet du Dashboard. Alt + 2: Se focaliser sur l’onglet des processus. Alt + 3: Se focaliser sur l’onglet des tâches. Alt + 4: Se focaliser sur l’onglet des cas. Alt + 5: Se focaliser sur la recherche. Alt + 6: Se focaliser sur
les paramètres utilisateur. Alt + A: Se focaliser sur le premier processus. Alt + W: Se focaliser sur la première tâche. Alt + Q: Se focaliser sur le premier cas. Tab: Navigation séquentielle entre les éléments. Esc: Fermer les widgets agrandis/Fermer les menus contextuels. Enter: Confirmer
la sélection'
CaseWidgetConfiguration:
AddFilter: Filter hinzufügen
ClientStatisticWidget:
Expand Down
44 changes: 44 additions & 0 deletions AxonIvyPortal/portal/cms/cms_en.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,8 @@ ch.ivy.addon.portalkit.ui.jsf:
nextAbsence: Upcoming absence
selectedDeputyFor: Selected user is substitute for
selectedUser: Selected user
AccessibilityShortcuts:
processName: Accessibility shortcuts process
AllTasks:
caseDescription: Case description
taskDescription: Task description
Expand Down Expand Up @@ -1333,6 +1335,48 @@ Dialogs:
LinkCopied: Link copied
dashboard:
component:
AccessibilityShortcuts:
content: |-
<div class="ui-g">
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + 1</span>Focus on to the Dashboard Tab
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + 4</span>Focus on to the Case Tab
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + A</span>Focus on to the first Process
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Tab</span>Sequential tabbing through elements
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + 2</span>Focus on to the Process Tab
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + 5</span>Focus on to the Search
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + W</span>Focus on to the first Task
</div>
<div class="ui-g-3 shortcut-content">
<span class="shortcut-key">Esc</span>Close expanded Widgets
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + 3</span>Focus on to the Tasks Tab
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + 6</span>Focus on to the User Settings
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Alt + Q</span>Focus on to the first Case
</div>
<div class="ui-g-3 shortcut-content ">
<span class="shortcut-key">Enter</span>Confirm selection
</div>
</div>
title: 'Accessibility Shortcuts. Alt + 1: Focus on to the Dashboard tab. Alt + 2: Focus on to the Process tab. Alt + 3: Focus on to the Tasks tab. Alt + 4: Focus on to the Case tab. Alt + 5: Focus on to the search. Alt + 6: Focus on to the User settings. Alt + A: Focus on to the first Process.
Alt + W: Focus on to the first task. Alt + Q: Focus on to the first case. Tab: Sequential tabbing through elements. Esc: Close expanded widgets. Enter: Confirm selection.'
CaseWidgetConfiguration:
AddFilter: Add filter
ClientStatisticWidget:
Expand Down
11 changes: 11 additions & 0 deletions AxonIvyPortal/portal/cms/cms_es.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,8 @@ ch.ivy.addon.portalkit.ui.jsf:
nextAbsence: Siguiente ausencia
selectedDeputyFor: El usuario seleccionado es el sustituto de
selectedUser: Usuario seleccionado
AccessibilityShortcuts:
processName: Atajos de accesibilidad de widgets
AllTasks:
caseDescription: Descripción de caso
taskDescription: Descripción de tarea
Expand Down Expand Up @@ -1331,6 +1333,15 @@ Dialogs:
LinkCopied: ¡Enlace copiado
dashboard:
component:
AccessibilityShortcuts:
content: "<div class=\"ui-g\">\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 1</span>Enfocar en la pestaña del Panel de Control\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 4</span>Enfocar en la\
\ pestaña de Casos\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + A</span>Enfocar en el primer proceso\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Tab</span>Tabbing secuencial a través de\
\ elementos\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 2</span>Enfocar en la pestaña de Procesos\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 5</span>Enfocar en la búsqueda\n </div>\n\
\ <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + W</span>Enfocar en la primera tarea\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Esc</span>Cerrar widgets expandidos/Cerrar menús contextuales\n </div>\n\
\ <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 3</span>Enfocar en la pestaña de Tareas\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + 6</span>Enfocar en la pestaña del Panel de Control\n </div>\n\
\ <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Alt + Q</span>Enfocar en el primer caso\n </div>\n <div class=\"ui-g-3 shortcut-content \">\n <span class=\"shortcut-key\">Enter</span>Confirmar selección\n </div>\n \n</div>"
title: 'Atajos de accesibilidad. Alt + 1: Enfocar en la pestaña del Panel de Control. Alt + 2: Enfocar en la pestaña de Procesos. Alt + 3: Enfocar en la pestaña de Tareas. Alt + 4: Enfocar en la pestaña de Casos. Alt + 5: Enfocar en la búsqueda. Alt + 6: Enfocar en la pestaña del Panel de
Control. Alt + A: Enfocar en el primer proceso. Alt + W: Enfocar en la primera tarea. Alt + Q: Enfocar en el primer caso. Tab: Tabbing secuencial a través de elementos. Esc: Cerrar widgets expandidos/Cerrar menús contextuales. Enter: Confirmar selección'
CaseWidgetConfiguration:
AddFilter: Añadir filtro
ClientStatisticWidget:
Expand Down
Loading

0 comments on commit 7d2195e

Please sign in to comment.