Skip to content

chore: add unique IDs to all ons-button elements #1481

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
mschoettle wants to merge 10 commits into
base: main
Choose a base branch
from
Draft

chore: add unique IDs to all ons-button elements #1481

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
0b4558c
chore: add unique IDs to all ons-button elements
mschoettle Jan 20, 2026
154dd0c
chore: add unique IDs to all ons-switch elements
mschoettle Jan 20, 2026
e0eb784
chore: add unique IDs to all ons-toolbar-button elements
mschoettle Jan 20, 2026
c8f480b
chore: add unique IDs to all login elements with ng-click
mschoettle Jan 20, 2026
4ecbdb7
chore: add unique IDs to all button elements with ng-click
mschoettle Jan 20, 2026
b0f0d25
chore: add unique IDs to all ons-back-button elements
mschoettle Jan 20, 2026
8ac4db8
chore: add unique IDs to all ons-list-item elements
mschoettle Jan 20, 2026
a6cbf0f
chore: add unique IDs to ons-list-item in hospital selector
mschoettle Jan 21, 2026
904ef7f
chore: add unique IDs to elements that were missed
mschoettle Jan 21, 2026
9f24b06
chore: add more unique IDs for testing
staceybeard Jan 22, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ <h4 style="margin: 5%">{{ "JAILBREAK_TITLE" | translate }}</h4>
<h3>Attention!</h3>
<ons-icon icon="ion-alert-circled" size="60px"></ons-icon>
<p style="margin-top: 5%" class="unattended-message">{{"SCREENSHOT_TAKEN"|translate}}</p>
<ons-button style="margin-top: 5%" ng-click="screenshotTakenModal.hide()">{{"OK"|translate}}</ons-button>
<ons-button id="modal-screenshot-ok-btn" style="margin-top: 5%" ng-click="screenshotTakenModal.hide()">{{"OK"|translate}}</ons-button>
</div>
</ons-modal>

Expand Down Expand Up @@ -121,11 +121,11 @@ <h3>Attention!</h3>
<div id="rcorners">
<h3>{{"TOUR_WELCOME"|translate}}</h3>
<p style="margin-top: 10%; margin-bottom:10%;" class="secure-message">{{"TOUR_MODAL_INTRODUCTION"|translate}}</p>
<ons-button ng-class="fontSizeTitle" style="background-color: #6a6261; margin: 2px"
<ons-button id="modal-tour-later-btn" ng-class="fontSizeTitle" style="background-color: #6a6261; margin: 2px"
ng-click="firstLoginTourModal.hide()">
{{"TOUR_MODAL_LATER_BUTTON"|translate}}
</ons-button>
<ons-button ng-class="fontSizeTitle" style="margin: 2px"
<ons-button id="modal-tour-start-btn" ng-class="fontSizeTitle" style="margin: 2px"
ng-click="firstLoginTourModal.hide(); homeNavigator.pushPage('views/home/tour/tour.html');">
{{"TOUR_MODAL_TAKE_TOUR_BUTTON"|translate}}
</ons-button>
Expand Down
2 changes: 1 addition & 1 deletion src/js/directives/hospitalSelectorDirective.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
"onClick": "=?",
},
template: `<ons-list>
<ons-list-item modifier="chevron" ng-click="goToHospitalSelection()" ng-style="!hospitalIsSelected() && {'background-color': 'rgba(241, 241, 88, 0.25882352941176473)'}">
<ons-list-item id="hospital-selector-{{$id}}-item" modifier="chevron" ng-click="goToHospitalSelection()" ng-style="!hospitalIsSelected() && {'background-color': 'rgba(241, 241, 88, 0.25882352941176473)'}">
{{"HOSPITAL"|translate}}
<span class="list-item-note lucent">{{getSelectedHospitalAcronym()|translate}}</span>
</ons-list-item>
Expand Down
2 changes: 1 addition & 1 deletion src/js/directives/loading-spinning-button.directive.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
// Boolean variable that indicates if the button should be disabled (and greyed out)
"disable": "=?",
},
template: `<ons-toolbar-button ng-click="executeClickFunction()" ng-disabled="disable">
template: `<ons-toolbar-button id="loading-spinning-btn-{{$id}}" ng-click="executeClickFunction()" ng-disabled="disable">
<ons-icon ng-class="{'glyphicon-refresh-animate': spin}" icon="ion-ios-refresh-empty" size="2x" style="color: #4F81BB"></ons-icon>
</ons-toolbar-button>
`,
Expand Down
2 changes: 1 addition & 1 deletion src/views/general/announcements/announcements.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
<div ng-hide="vm.hideContent || vm.noAnnouncements">
<ons-list ng-repeat="announcement in vm.announcements" ng-click="vm.goToAnnouncement(announcement)">
<ons-list-header class="default-list-header" ng-class="fontSizeTitle" ng-show="{{ vm.announcements | showHeader : $index : 'DateAdded' }}">{{ announcement.DateAdded | date:'fullDate' }}</ons-list-header>
<ons-list-item modifier="chevron" class="item">
<ons-list-item id="announcement-{{$index}}-item" modifier="chevron" class="item">
<ons-row align="center" >
<ons-col width="70px" align="center">
<div style="margin-left:10px">
Expand Down
4 changes: 2 additions & 2 deletions src/views/general/feedback/feedback.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
<textarea class="textarea textarea--transparent" placeholder="{{feedback.placeholder | translate}}" ng-model="feedbackText" style="width: 100%; height: 50vh; margin: 10px" ng-class="fontSizeDesc" ng-disabled="feedback.isSubmitting"></textarea>
</ons-row>
<ons-row ng-show="!feedback.submitted" class="feedback--element-spacing">
<ons-button class="shadow-2" ng-class="fontSizeTitle" style="width: 100%; text-align: center; background-color: #4CAF50"
<ons-button id="feedback-send-btn" class="shadow-2" ng-class="fontSizeTitle" style="width: 100%; text-align: center; background-color: #4CAF50"
ng-click="feedback.submitFeedback(feedback.feedbackType)" ng-disabled="feedback.submitted||!feedback.enableSend||feedback.isSubmitting">
{{"SEND"|translate}}
<ons-icon icon="ion-load-d" spin="true" ng-show="feedback.isSubmitting"></ons-icon>
Expand All @@ -47,7 +47,7 @@
<div align="center" style="width: 100%; text-align: center">
<h3>{{"THANK_YOU_FOR_FEEDBACK"|translate}}</h3>
<p>{{"FEEDBACK_RECEIVED"|translate}}</p>
<ons-button style="margin-top: 5%" align="center" ng-click="feedback.reset()">{{"SEND_ANOTHER"|translate}}</ons-button>
<ons-button id="feedback-send-another-btn" style="margin-top: 5%" align="center" ng-click="feedback.reset()">{{"SEND_ANOTHER"|translate}}</ons-button>
</div>
</div>
</ons-page>
14 changes: 7 additions & 7 deletions src/views/general/general.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<ons-page ng-controller="GeneralTabController as tab" ng-device-backbutton="tab.generalDeviceBackButton()">
<generic-toolbar title="{{'GENERAL'|translate}}" back-button="false" style-class="fontSizeTitle">
<right-content>
<ons-toolbar-button ng-click="generalNavigator.pushPage('./views/tabs/info-page-tabs.html', {id:'general'})">
<ons-toolbar-button id="toolbar-general-info-btn" ng-click="generalNavigator.pushPage('./views/tabs/info-page-tabs.html', {id:'general'})">
<ons-icon icon="fa-info-circle"></ons-icon>
</ons-toolbar-button>
</right-content>
Expand All @@ -17,7 +17,7 @@
<div>
<network-banner></network-banner>
<ons-list style="margin: 0px 0">
<ons-list-item modifier="chevron" class="item"
<ons-list-item id="general-announcements-item" modifier="chevron" class="item"
ng-if="tab.allowedModules.hasOwnProperty('ANN') && tab.allowedModules['ANN']"
ng-click="generalNavigator.pushPage('views/general/announcements/announcements.html')">
<ons-row align="center">
Expand All @@ -36,7 +36,7 @@
</ons-col>
</ons-row>
</ons-list-item>
<ons-list-item modifier="chevron" class="item"
<ons-list-item id="general-parking-item" modifier="chevron" class="item"
ng-if="tab.allowedModules.hasOwnProperty('PAT') && tab.allowedModules['PAT']"
ng-click="tab.goToParking()">
<ons-row align="center">
Expand All @@ -53,7 +53,7 @@
</ons-col>
</ons-row>
</ons-list-item>
<ons-list-item modifier="chevron" class="item"
<ons-list-item id="general-feedback-item" modifier="chevron" class="item"
ng-if="tab.allowedModules.hasOwnProperty('FEE') && tab.allowedModules['FEE']"
ng-click="generalNavigator.pushPage('views/general/feedback/feedback.html', {contentType: 'general'})">
<ons-row align="center">
Expand All @@ -70,7 +70,7 @@
</ons-col>
</ons-row>
</ons-list-item>
<ons-list-item class="item"
<ons-list-item id="general-find-doctor-item" class="item"
ng-if="tab.allowedModules.hasOwnProperty('FFD') && tab.allowedModules['FFD']"
ng-click="tab.goToUrl('findDoctor')">
<ons-row align="center">
Expand All @@ -92,7 +92,7 @@
</ons-col>
</ons-row>
</ons-list-item>
<ons-list-item class="item"
<ons-list-item id="general-medical-scheduler-item" class="item"
ng-if="tab.allowedModules.hasOwnProperty('MAS') && tab.allowedModules['MAS']"
ng-click="tab.goToUrl('medicalScheduler')">
<ons-row align="center">
Expand All @@ -116,7 +116,7 @@
</ons-col>
</ons-row>
</ons-list-item>
<ons-list-item class="item"
<ons-list-item id="general-carnet-sante-item" class="item"
ng-if="tab.allowedModules.hasOwnProperty('CSQ') && tab.allowedModules['CSQ']"
ng-click="tab.goToCarnetSante()">
<ons-row align="center">
Expand Down
4 changes: 2 additions & 2 deletions src/views/general/parking/parking.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
<div ng-hide="parking.loading">
<ons-list ng-repeat="site in parking.sites" modifier="chevron tappable" class="settings-list">
<ons-list-header ng-class="fontSizeTitle">{{site.name}}</ons-list-header>
<ons-list-item ng-click="parking.goToParkingLink(site.direction_url)" ng-class="fontSizeDesc">
<ons-list-item id="parking-directions-{{$index}}-item" ng-click="parking.goToParkingLink(site.direction_url)" ng-class="fontSizeDesc">
<ons-row align="center">
<ons-col width="60px" style="text-align: center">
<div>
Expand All @@ -31,7 +31,7 @@
</ons-col>
</ons-row>
</ons-list-item>
<ons-list-item ng-click="parking.goToParkingLink(site.parking_url)" ng-class="fontSizeDesc">
<ons-list-item id="parking-info-{{$index}}-item" ng-click="parking.goToParkingLink(site.parking_url)" ng-class="fontSizeDesc">
<ons-row align="center">
<ons-col width="60px" style="text-align: center">
<div>
Expand Down
10 changes: 5 additions & 5 deletions src/views/home/about/about.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
<network-banner></network-banner>
<ons-list>
<!-- TOUR -->
<ons-list-item class="item" modifier="tappable chevron" ng-click="about.openTour()">
<ons-list-item id="about-tour-item" class="item" modifier="tappable chevron" ng-click="about.openTour()">
<ons-row align="center">
<ons-col width="60px" style="text-align: center">
<div>
Expand All @@ -24,7 +24,7 @@
</ons-list-item>

<!-- WEBSITE -->
<ons-list-item class="item" modifier="tappable" ng-click="about.openUrl('opalWebsite')">
<ons-list-item id="about-website-item" class="item" modifier="tappable" ng-click="about.openUrl('opalWebsite')">
<ons-row align="center">
<ons-col width="60px" style="text-align: center">
<div>
Expand All @@ -41,7 +41,7 @@
</ons-list-item>

<!-- CONTRIBUTE -->
<ons-list-item class="item" modifier="tappable" ng-click="about.openUrl('donation', true)">
<ons-list-item id="about-contribute-item" class="item" modifier="tappable" ng-click="about.openUrl('donation', true)">
<ons-row align="center">
<ons-col width="60px" style="text-align: center">
<div>
Expand All @@ -58,7 +58,7 @@
</ons-list-item>

<!-- CONTACT SUPPORT -->
<ons-list-item class="item" modifier="tappable" ng-click="about.openUrl('support', true)">
<ons-list-item id="about-support-item" class="item" modifier="tappable" ng-click="about.openUrl('support', true)">
<ons-row align="center">
<ons-col width="60px" style="text-align: center">
<div>
Expand All @@ -75,7 +75,7 @@
</ons-list-item>

<!-- TECHNICAL / LEGAl -->
<ons-list-item class="item" modifier="tappable chevron" ng-click="about.openTechnicalLegal()">
<ons-list-item id="about-technical-legal-item" class="item" modifier="tappable chevron" ng-click="about.openTechnicalLegal()">
<ons-row align="center">
<ons-col width="60px" style="text-align: center">
<span class="fa-layers fa-2x">
Expand Down
4 changes: 2 additions & 2 deletions src/views/home/checkin/checkin-list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
<ons-list-header class="default-list-header" ng-class="fontSizeTitle" style="padding:10px;">
{{patient.patientHeader}}
</ons-list-header>
<ons-list-item modifier="tappable chevron" ng-repeat="app in patient.apps" ng-click="checkIn.goToAppointment(app)">
<ons-list-item id="checkin-appointment-{{$index}}-item" modifier="tappable chevron" ng-repeat="app in patient.apps" ng-click="checkIn.goToAppointment(app)">

<!-----------------------------------------------------------------
The appointment will show the status according to its checkin status,
Expand Down Expand Up @@ -98,7 +98,7 @@
</ons-row>
</ons-list-item>
<ons-list-item ng-if="!patient.allCheckedIn" class="item-btn">
<ons-button ng-class="fontSizeTitle" class="checkin-btn"
<ons-button id="checkin-all-btn" ng-class="fontSizeTitle" class="checkin-btn"
ng-click="checkIn.checkIntoAppointments(patientSerNum)"
ng-disabled="checkIn.patientHasAppointmentLoading(patient)">
{{"CHECKIN_ALL_TODAY"|translate}}
Expand Down
10 changes: 5 additions & 5 deletions src/views/home/home.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<ons-page ng-controller="HomeController as Ctrl" ng-device-backbutton="Ctrl.homeDeviceBackButton()">
<generic-toolbar title="{{'HEADER_MESSAGE_HOME'|translate}}" back-button="false" style-class="fontSizeTitle">
<right-content>
<ons-toolbar-button ng-click="homeNavigator.pushPage('views/tabs/info-page-tabs.html', {id:'home'})"><ons-icon icon="fa-info-circle"></ons-icon></ons-toolbar-button>
<ons-toolbar-button id="toolbar-home-info-btn" ng-click="homeNavigator.pushPage('views/tabs/info-page-tabs.html', {id:'home'})"><ons-icon icon="fa-info-circle"></ons-icon></ons-toolbar-button>
</right-content>
</generic-toolbar>

Expand Down Expand Up @@ -42,7 +42,7 @@
PARTNERS
================================
-->
<ons-list-item modifier="chevron tappable" class="item" ng-click="Ctrl.goToPartners()">
<ons-list-item id="home-partners-item" modifier="chevron tappable" class="item" ng-click="Ctrl.goToPartners()">
<ons-row align="center">
<ons-col class="home-view--list--icon">
<ons-icon icon="fa-star" size="28px" style="color:#FFEB3B"></ons-icon>
Expand All @@ -60,7 +60,7 @@
ABOUT OPAL
================================
-->
<ons-list-item modifier="chevron tappable" class="item" ng-click="Ctrl.goToAboutOpal()">
<ons-list-item id="home-about-opal-item" modifier="chevron tappable" class="item" ng-click="Ctrl.goToAboutOpal()">
<ons-row align="center">
<ons-col class="home-view--list--icon">
<img class="home-view--opal--logo" src="img/Opal_Logo_Transparent_Inverse_Icon.png">
Expand All @@ -78,7 +78,7 @@
NOTIFICATIONS
================================
-->
<ons-list-item modifier="chevron" class="item" ng-if="Ctrl.allowedModules.hasOwnProperty('NTF') && Ctrl.allowedModules['NTF']" ng-click="homeNavigator.pushPage('views/personal/notifications/notifications.html')">
<ons-list-item id="home-notifications-item" modifier="chevron" class="item" ng-if="Ctrl.allowedModules.hasOwnProperty('NTF') && Ctrl.allowedModules['NTF']" ng-click="homeNavigator.pushPage('views/personal/notifications/notifications.html')">
<ons-row align="center">
<ons-col class="home-view--list--icon">
<ons-icon
Expand Down Expand Up @@ -148,7 +148,7 @@
APPOINTMENT STATUS
================================
-->
<ons-list-item modifier="chevron" class="item" ng-if="Ctrl.allowedModules.hasOwnProperty('APT') && Ctrl.allowedModules['APT']" ng-click="Ctrl.goToAppointments()">
<ons-list-item id="home-appointments-item" modifier="chevron" class="item" ng-if="Ctrl.allowedModules.hasOwnProperty('APT') && Ctrl.allowedModules['APT']" ng-click="Ctrl.goToAppointments()">
<ons-row align="center">
<ons-col class="home-view--list--icon">
<i class="fa-regular fa-calendar-days fa-2x" style="color: #ffc107"></i>
Expand Down
10 changes: 5 additions & 5 deletions src/views/init/init-screen.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@

<!-- PARTNERS -->
<div class="initScreenButtonDiv">
<ons-button class="shadow-2 initScreenWhiteButton" modifier="large"
<ons-button id="init-partners-btn" class="shadow-2 initScreenWhiteButton" modifier="large"
ng-click="init.goToPartners()" var="initButton">
<ons-icon icon="fa-star fa-lg pull-left"
style="color:#FFEB3B; display: inline-block"></ons-icon>
Expand All @@ -37,7 +37,7 @@

<!-- ABOUT OPAL -->
<div class="initScreenButtonDiv">
<ons-button class="shadow-2 initScreenWhiteButton" modifier="large"
<ons-button id="init-about-opal-btn" class="shadow-2 initScreenWhiteButton" modifier="large"
ng-click="init.goToAboutOpal()" var="initButton">
<ons-row align="center">
<ons-col width="60px" align="center">
Expand All @@ -52,7 +52,7 @@

<!-- TECHNICAL / LEGAL -->
<div class="initScreenButtonDiv">
<ons-button class="shadow-2 initScreenWhiteButton" modifier="large"
<ons-button id="init-legal-btn" class="shadow-2 initScreenWhiteButton" modifier="large"
ng-click="init.goToTechnicalLegal()" var="initButton">
<i class="fa fa-info-circle fa-lg pull-left"
style="color:grey; display: inline-block"></i>
Expand All @@ -64,7 +64,7 @@

<!-- REGISTER OPAL -->
<div class="initScreenButtonDiv">
<ons-button class="shadow-2 initScreenWhiteButton" modifier="large"
<ons-button id="init-register-btn" class="shadow-2 initScreenWhiteButton" modifier="large"
ng-click="init.goToRegister()" var="initButton">
<i class="fa fa-user-circle fa-lg pull-left"
style="color:#4CAF50; display: inline-block"></i>
Expand All @@ -76,7 +76,7 @@

<!-- SIGN IN -->
<div class="initScreenButtonDiv">
<ons-button class="animate__animated animate__pulse ng-cloak shadow-2 initScreenGreenButton" modifier="large"
<ons-button id="init-signin-btn" class="animate__animated animate__pulse ng-cloak shadow-2 initScreenGreenButton" modifier="large"
ng-click="init.goToLogin()" var="initButton">{{"HEADER_MESSAGE_LOGIN"|translate}}
</ons-button>
</div>
Expand Down
Loading