Add data-testid to test relevant elements (fixes #244)
Change-Id: Id908e38f01e426543ed98975544204a9a632294d
diff --git a/Changes b/Changes
index 8e75fa7..91110b6 100644
--- a/Changes
+++ b/Changes
@@ -1,3 +1,5 @@
+ - Add data-testid to test relevant elements (fixes #244; diewald)
+
0.62 2025-12-05
- Fixed white box under query field glitch (kupietz, diewald)
- Add translations of api, data, development and faq (wilm, stallkamp)
diff --git a/lib/Kalamar/Plugin/Auth/templates/partial/auth/login.html.ep b/lib/Kalamar/Plugin/Auth/templates/partial/auth/login.html.ep
index fe8fadc..4c03356 100644
--- a/lib/Kalamar/Plugin/Auth/templates/partial/auth/login.html.ep
+++ b/lib/Kalamar/Plugin/Auth/templates/partial/auth/login.html.ep
@@ -35,7 +35,7 @@
%= form_for 'login', 'accept-charset' => 'utf-8', class => 'login', begin
<legend><span><%= loc 'login' %></span></legend>
%= csrf_field
- %= text_field 'handle_or_email', placeholder => loc('userormail')
+ %= text_field 'handle_or_email', 'data-testid' => 'handle-or-email', placeholder => loc('userormail')
%= hidden_field fwd => $c->url_with
% if (stash('client_id')) {
%= hidden_field 'client_id' => stash('client_id')
@@ -44,8 +44,8 @@
%= hidden_field 'scope' => stash('scope')
%= hidden_field 'redirect_uri' => stash('close_redirect_uri')
% };
- %= password_field 'pwd', placeholder => loc('pwd')
- <button type="submit" class="btn-login"><span><%= loc 'go' %></span></button>
+ %= password_field 'pwd', 'data-testid' => 'pwd', placeholder => loc('pwd')
+ <button type="submit" class="btn-login" data-testid="login-submit"><span><%= loc 'go' %></span></button>
% end
%= content_block 'loginInfo', separator => '<hr />'
</div>
diff --git a/lib/Kalamar/Plugin/Auth/templates/partial/auth/logout.html.ep b/lib/Kalamar/Plugin/Auth/templates/partial/auth/logout.html.ep
index 1b7fd80..7186e32 100644
--- a/lib/Kalamar/Plugin/Auth/templates/partial/auth/logout.html.ep
+++ b/lib/Kalamar/Plugin/Auth/templates/partial/auth/logout.html.ep
@@ -13,6 +13,7 @@
</a>
<% } %>
<a href="<%= url_for 'logout' %>"
+ data-testid="logout"
class="dropdown-item logout"
title="<%= loc 'logout' %>: <%= user_handle %>">
<span><%= loc 'logout' %></span>
diff --git a/t/page.t b/t/page.t
index 5fb2129..123a720 100644
--- a/t/page.t
+++ b/t/page.t
@@ -35,6 +35,8 @@
->header_is('X-Content-Type-Options', 'nosniff')
->header_is('Access-Control-Allow-Methods','GET, POST, OPTIONS')
->header_is('X-XSS-Protection', '1; mode=block')
+ ->element_exists('*[data-testid=home]')
+ ->element_exists('*[data-testid=tour-start]')
;
# Test additions
diff --git a/t/plugin/auth-oauth.t b/t/plugin/auth-oauth.t
index 1becd11..f1349a6 100644
--- a/t/plugin/auth-oauth.t
+++ b/t/plugin/auth-oauth.t
@@ -116,6 +116,10 @@
$t->get_ok('/')
->status_is(200)
->element_exists('form[action=/user/login] input[name=handle_or_email]')
+ ->element_exists('*[data-testid=handle-or-email]')
+ ->element_exists('*[data-testid=pwd]')
+ ->element_exists('*[data-testid=login-submit]')
+ ->element_exists_not('*[data-testid=logout]')
->element_exists('aside')
->element_exists('aside.invisible')
;
@@ -123,6 +127,7 @@
$t->get_ok('/settings/oauth')
->status_is(401)
->text_is('p.no-results', 'Not authenticated')
+ ->text_is('*[data-testid=error-message]','Not authenticated')
;
$t->get_ok('/settings/marketplace')
@@ -230,6 +235,8 @@
->element_exists_not('div.notify-error')
->content_like(qr/${q}authorized${q}:${q}yes${q}/)
->element_exists('nav.dropdown')
+ ->element_exists_not('*[data-testid=handle-or-email]')
+ ->element_exists('*[data-testid=logout]')
->element_exists('a.dropdown-item.logout[title~="test"]')
;
diff --git a/templates/exception.html.ep b/templates/exception.html.ep
index f85edc6..abff9aa 100644
--- a/templates/exception.html.ep
+++ b/templates/exception.html.ep
@@ -1,6 +1,6 @@
% my $msg = stash('msg') // stash('exception')->message // '500: Internal Server Error';
% layout 'main', title => 'KorAP: ' . $msg;
-<p class="no-results"><%= $msg %></p>
+<p class="no-results" data-testid="error-message"><%= $msg %></p>
% notify('error' => $msg);
diff --git a/templates/failure.html.ep b/templates/failure.html.ep
index e1f6fb3..c644e3a 100644
--- a/templates/failure.html.ep
+++ b/templates/failure.html.ep
@@ -9,5 +9,5 @@
<p class="no-results"><%= loc('notIssued') %></p>
% if (stash('err_msg')) {
-<p class="no-results"><%== loc(stash('err_msg'),stash('err_msg')) %></p>
+<p class="no-results" data-testid="error-message"><%== loc(stash('err_msg'),stash('err_msg')) %></p>
% }
diff --git a/templates/not_found.html.ep b/templates/not_found.html.ep
index 8410580..87d649b 100644
--- a/templates/not_found.html.ep
+++ b/templates/not_found.html.ep
@@ -1,6 +1,6 @@
% my $msg = stash('msg') // loc('notFound');
% layout 'main', title => 'KorAP: ' . loc('notFound');
-<p class="no-results"><%= $msg %></p>
+<p class="no-results" data-testid="error-message"><%= $msg %></p>
% notify('warn' => $msg);
diff --git a/templates/partial/header.html.ep b/templates/partial/header.html.ep
index 966401e..5a2189a 100644
--- a/templates/partial/header.html.ep
+++ b/templates/partial/header.html.ep
@@ -1,5 +1,5 @@
% content_block 'headerButtonGroup', { position => 50 }, begin
- <h3 class="nav-link"><a class="link-guided-tour">Tour</a></h3>
+ <h3 class="nav-link"><a class="link-guided-tour" data-testid="tour-start">Tour</a></h3>
% end
% content_block 'headerButtonGroup', { position => 100 }, begin
@@ -7,7 +7,7 @@
% end
<nav class="navbar">
- <%= link_to 'index', class => 'logo', begin %><h1><span><%= title() // loc('korap_desc') %></span><% if (loc('title_addon')) { %><div class="logoaddon"><%= loc('title_addon') %></div><% } %></h1><% end %>
+ <%= link_to 'index', class => 'logo', 'data-testid' => 'home', begin %><h1><span><%= title() // loc('korap_desc') %></span><% if (loc('title_addon')) { %><div class="logoaddon"><%= loc('title_addon') %></div><% } %></h1><% end %>
<div class="navbar-group">
%= content_block 'headerButtonGroup'