Skip to content

Commit

Permalink
Merge pull request #888 from hmcts/PAY-7126
Browse files Browse the repository at this point in the history
Pay 7126
  • Loading branch information
Thor-tech-of-metal authored Jun 10, 2024
2 parents 079694d + 3aa2819 commit 485a291
Show file tree
Hide file tree
Showing 24 changed files with 358 additions and 162 deletions.
6 changes: 5 additions & 1 deletion sonar-project.properties
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,11 @@ sonar.sources=src/app
sonar.tests=src/app
sonar.test.inclusions=**.spec.ts,**.test.js
sonar.host.url=https://sonarcloud.io/
sonar.exclusions=src/app/components/cookie-banner/*,**/feature.edit.component.ts,**.mock.ts,**.mock.js,**/roles.ts,**/app.module.ts,**/app.component.ts,**/auth.dev.interceptor.ts,**/app-routing.module.ts,**/test-utils/**
sonar.exclusions=src/app/shared/components/footer/*,src/components/accessibility-statement/*,src/app/components/accessibility-statement/*,src/app/components/cookie-banner/*,**/feature.edit.component.ts,**.mock.ts,**.mock.js,**/roles.ts,**/app.module.ts,**/app.component.ts,**/auth.dev.interceptor.ts,**/app-routing.module.ts,**/test-utils/**





sonar.ts.coverage.lcovReportPath=coverage/ccpay-bubble/lcov-angular.info
sonar.javascript.lcov.reportPaths=coverage/ccpay-bubble/lcov-angular.info
Expand Down
15 changes: 1 addition & 14 deletions src/app/app.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,18 +17,5 @@
</div>

<footer class="group js-footer" id="footer" role="contentinfo">
<div class="footer-wrapper">
<div class="footer-meta">
<div class="footer-meta-inner">
<div class="open-government-licence">
<p class="logo">
<a href="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/" rel="license">Open Government Licence</a>
</p>
<p>All content is available under the
<a href="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/"
rel="license">Open Government Licence v3.0</a>, except where otherwise stated</p>
</div>
</div>
</div>
</div>
<ccpay-bubble-app-footer></ccpay-bubble-app-footer>
</footer>
6 changes: 5 additions & 1 deletion src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,8 @@ import { CookieDetailsComponent } from './components/cookie-details/cookie-detai
import { windowProvider, windowToken } from '../window';
import { CookieTableComponent } from './components/cookie-table/cookie-table.component';
import { RpxTranslationModule } from 'rpx-xui-translation';
import {FooterComponent} from "./shared/components/footer/footer.component";
import {AccessibilityStatementComponent} from "./components/accessibility-statement/accessibility-statement.component";

const nonProductionProviders = [{
provide: HTTP_INTERCEPTORS,
Expand Down Expand Up @@ -66,7 +68,9 @@ const nonProductionProviders = [{
CookieBannerComponent,
CookiePolicyComponent,
CookieDetailsComponent,
CookieTableComponent
CookieTableComponent,
AccessibilityStatementComponent,
FooterComponent
],
imports: [
BrowserModule,
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
<div class="govuk-width-container">
<div class="govuk-grid-row">
<a (click)="backClicked()" class="link-back">Back</a>
<h1 class="heading-xlarge">Accessibility statement for PayBubble</h1>

<p>This accessibility statement applies to Paybubble: <a target="_blank" href="https://paybubble.platform.hmcts.net" rel="noopener">https://paybubble.platform.hmcts.net</a><br/>
This website is run by HM Courts and Tribunals Service. We want as many people as possible to be able to use this website. For example, that means you should be able to:</p>
<ul class="govuk-list--bullet">
<li>change colours, contrast levels and fonts</li>
<li>zoom in up to 300% without the text spilling off the screen</li>
<li>navigate most of the website using just a keyboard</li>
<li>navigate most of the website using speech recognition software</li>
<li>listen to most of the website using a screen reader (including the most recent versions of JAWS, NVDA and VoiceOver)</li>
</ul>
<br>
We've also made the website text as simple as possible to understand.<br>
Please contact your line manager for advice on making your device easier to use if you have a disability.<br><br>

<h2 class="govuk-heading-l">How accessible this website is</h2>

<p>We know some parts of this website are not fully accessible:</p>
<ul class="govuk-list--bullet">
<li>the text will not reflow in a single column when you change the size of the browser window</li>
<li>some of our online forms are difficult to navigate using just a keyboard</li>
<li>you cannot skip to the main content when using a screen reader.</li>
</ul>
<br>
<h2 class="govuk-heading-l">Reporting accessibility problems with this website</h2>

<p>We're always looking to improve the accessibility of this website. If you find any problems not listed on this page or think we're not meeting accessibility requirements, contact: <a href="mailto:[email protected]">DTS-FeePayServiceDesk&#64;hmcts.net</a> for guidance to raise any issues.</p>

<h2 class="govuk-heading-l">Enforcement procedure</h2>

<p>The Equality and Human Rights Commission (EHRC) is responsible for enforcing the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 (the 'accessibility regulations').
If you're not happy with how we respond to your complaint, contact the <a href="https://www.equalityadvisoryservice.com/" target="_blank" rel="noopener">Advisory and Support Service (EASS).</a></p>

<h2 class="govuk-heading-l">Technical information about this website's accessibility</h2>

<p>HMCTS is committed to making its website accessible, in accordance with the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018.</p>

<h2 class="govuk-heading-l">Compliance status</h2>

<p>This website is partially compliant with the <a href="https://www.w3.org/TR/WCAG21/" target="_blank" rel="noopener">Web Content Accessibility Guidelines version 2.1</a> AA standard, due to the non-compliances, listed below.</p>

<h2 class="govuk-heading-l">Non-accessible content</h2>

<p>The content listed below is non-accessible for the following reasons.</p>

<h2 class="govuk-heading-l">Non-compliance with the accessibility regulations</h2>

<p>A layout table is present but does not contain any header cells. The screen reader users are not able to associate the table data to table headings. This failed to meet 1.1.1 Non-Text Content Level A.<br/>
The headings are not hierarchical and heading level 2 is skipped. There are multiple links that are identified as text elements rather than links (This issue pertains only to Safari browser not Google Chrome). A group of radio buttons are not enclosed in a fieldset. This failed to meet 1.3.1 Info and Relationships Level A.
Some of the content gets lost or overlaps when the page is zoomed in to 200% on laptops and at actual size on a mobile device. This failed to meet 1.4.4 Resize Text Level AA.<br/>
Some content can be lost or overlaps on different smaller devices. This fails to meet 1.4.10 Reflow.<br/>
The highlight colour does not meet contrast requirements for links. The skip to main content link overlaps other content and then fails contrast. This failed to meet 1.4.11 Non-Text Contrast Level AA.<br/>
There are multiple links that cannot be tabbed to from the keyboard or do not receive keyboard focus. This failed to meet 2.1.1 Keyboard Level A.<br/>
The 'skip to main' content link does not skip to main content because the main content region is missing. The navigation landmark is also not present. This failed to meet 2.4.1 Bypass Blocks Level A.<br/>
The page titles are not unique and do not describe the page. This failed to meet 2.4.2 Page Titled Level A.<br/>
The pages look identical when searching for a case transaction, payment history, or service request. This could be confusing for users who might think they have not moved pages. The page has no h1 headings. This failed to meet 2.4.6 Headings and Labels Level AA.<br/>
The language of the document is not identified or the lang attribute value is invalid. This failed to meet 3.1.1 Language of Page Level A.<br/>
The keyboard focus is not taken to the error summary and is not announced to screen reader users immediately. This failed to meet 3.3.1 Error Identification Level A.<br/>
A form label is not accurate in its description so it would not make sense for screen reader users. Also, the words which visually label a component are not the words read by the screenreader. This failed to meet 3.3.2 Labels or Instructions Level A.<br/>
The status message for how many results were found is not announced to screen reader users. This failed to meet 4.1.3 Status Messages Level AA.</p>

<h2 class="govuk-heading-l">What we're doing to improve accessibility</h2>
<p>We're committed to ensuring our services are accessible to all our users and that they comply with <a target="_blank" href="https://www.w3.org/TR/WCAG22/" rel="noopener">Web Content Accessibility Guidelines (WCAG) 2.2</a> Standard. To demonstrate this, we are going to engage with Digital Accessibility Centre to have a further review on 06/24<br/>
We're actively working to improve the identified issues and make them AA-compliant by 31/05/24</p>

<h2 class="govuk-heading-l">Preparation of this accessibility statement</h2>
This statement was published 14/03/24<br>
This website was last tested on 15/06/22. The test was carried out by Internal Accessibility Team within HMCTS.<br>
The full service was tested.
</div>
</div>
Empty file.
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { SpyLocation } from '@angular/common/testing';
import { AccessibilityStatementComponent } from './accessibility-statement.component';
import { Location } from '@angular/common';

describe('AccessibilityStatementComponent', () => {
let component: AccessibilityStatementComponent;
let fixture: ComponentFixture<AccessibilityStatementComponent>;
let location: SpyLocation;

beforeEach(() => {
TestBed.configureTestingModule({
declarations: [AccessibilityStatementComponent],
providers: [
{ provide: Location, useClass: SpyLocation }
]
});
fixture = TestBed.createComponent(AccessibilityStatementComponent);
component = fixture.componentInstance;
location = TestBed.get(Location);
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});

it('should go back to previous page on header button click', () => {
spyOn(location, 'back');
component.backClicked();
expect(location.back).toHaveBeenCalled();
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { Component } from '@angular/core';
import { Location } from '@angular/common';

@Component({
selector: 'app-accessibility-statement',
templateUrl: './accessibility-statement.component.html',
styleUrls: ['./accessibility-statement.component.scss']
})
export class AccessibilityStatementComponent {
constructor(private _location: Location)
{}

backClicked() {
this._location.back();
}
}
34 changes: 0 additions & 34 deletions src/app/components/cookie-banner/cookie-banner.component.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -38,40 +38,6 @@ describe('CookieBannerComponent', () => {
it('should be created by angular', () => {
expect(fixture).not.toBeNull();
});
it ('should make a call all enable function and push', () => {
spyOn((windowTestBed as any).dtrum, 'enable').and.callThrough();
spyOn((windowTestBed as any).dtrum, 'enableSessionReplay').and.callThrough();
spyOn((windowTestBed as any).dataLayer, 'push').and.callThrough();

const preference = { apm: 'on' };

appComponent.preferenceFn((windowTestBed as any).dtrum, preference, (windowTestBed as any).dataLayer);
expect((windowTestBed as any).dataLayer.push).toHaveBeenCalled();
expect((windowTestBed as any).dtrum.enable).toHaveBeenCalled();
expect((windowTestBed as any).dtrum.enableSessionReplay).toHaveBeenCalled();
});
it ('should make a call all disable function and push', () => {
spyOn((windowTestBed as any).dtrum, 'disableSessionReplay').and.callThrough();
spyOn((windowTestBed as any).dtrum, 'disable').and.callThrough();
spyOn((windowTestBed as any).dataLayer, 'push').and.callThrough();
const preference = { apm: 'off' };

appComponent.preferenceFn((windowTestBed as any).dtrum, preference, (windowTestBed as any).dataLayer);
expect((windowTestBed as any).dataLayer.push).toHaveBeenCalled();
expect((windowTestBed as any).dtrum.disableSessionReplay).toHaveBeenCalled();
expect((windowTestBed as any).dtrum.disable).toHaveBeenCalled();
});
it ('should make a call all disable function', () => {
spyOn((windowTestBed as any).dtrum, 'disableSessionReplay').and.callThrough();
spyOn((windowTestBed as any).dtrum, 'disable').and.callThrough();
spyOn((windowTestBed as any).dataLayer, 'push').and.callThrough();
const preference = { apm: 'off' };

appComponent.preferenceFn(undefined, preference, (windowTestBed as any).dataLayer);
expect((windowTestBed as any).dataLayer.push).toHaveBeenCalled();
expect((windowTestBed as any).dtrum.disableSessionReplay).not.toHaveBeenCalled();
expect((windowTestBed as any).dtrum.disable).not.toHaveBeenCalled();
});

afterEach(() => {
TestBed.resetTestingModule();
Expand Down
66 changes: 1 addition & 65 deletions src/app/components/cookie-banner/cookie-banner.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,69 +20,5 @@ export class CookieBannerComponent implements OnInit {
this.window = window as Window;
}

public ngOnInit(): void {

const config = {
userPreferences: {
cookieName: 'ccpay-bubble-cookie-preferences',
},
preferencesForm: {
class: 'cookie-preferences-form',
},
cookieManifest: [
{
categoryName: 'analytics',
cookies: [
'_ga',
'_gid',
'_gat_UA-'
]
},
{
categoryName: 'apm',
cookies: [
'dtCookie',
'dtLatC',
'dtPC',
'dtSa',
'rxVisitor',
'rxvt'
]
},
{
categoryName: 'essential',
optional: false,
matchBy: 'exact',
cookies: [
'_csrf',
'__user-info'
]
},
]
};

cookieManager.on('UserPreferencesLoaded', (preferences) => {
const dataLayer = window['dataLayer'] || [];
dataLayer.push({'event': 'Cookie Preferences', 'cookiePreferences': preferences});
});
cookieManager.on('UserPreferencesSaved', (preferences) => {
const dataLayer = window['dataLayer'] || [];
const dtrum = window['dtrum'];
this.preferenceFn(dtrum, preferences, dataLayer);
});
cookieManager.init(config);
}

preferenceFn(dtrum, preferences, dataLayer) {
dataLayer.push({'event': 'Cookie Preferences', 'cookiePreferences': preferences});
if (dtrum !== undefined) {
if (preferences.apm === 'on') {
dtrum.enable();
dtrum.enableSessionReplay();
} else {
dtrum.disableSessionReplay();
dtrum.disable();
}
}
}
public ngOnInit(): void {}
}
54 changes: 21 additions & 33 deletions src/app/components/cookie-policy/cookie-policy.component.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<div class="govuk-width-container">

<div class="govuk-grid-row">
<a href="/" class="link-back">Back</a>
<a (click)="backClicked()" class="link-back">Back</a>
<div class="cookie-preference-success notification-banner--success">
<div class="success-message" aria-labelledby="success-title" role="alert" tabindex="-1">
<h2 class="govuk-heading-m notification-fs">
Expand Down Expand Up @@ -43,9 +43,7 @@ <h2 class="govuk-heading-l" id="1-to-measure-website-usage">Cookies used to meas
<li>what you click on while you’re visiting the service</li>
</ul>
<br/>
<p >We allow Google to use or share our analytics data. You can find out more about how Google use this information in their <a target="_blank"
href="https://www.google.com/policies/privacy/partners/" rel="noopener">privacy
policy</a>.</p>
<p >We allow Google to use or share our analytics data. You can find out more about how Google use this information in their <a target="_blank" href="https://www.google.com/policies/privacy/partners/" rel="noopener">privacy policy</a>.</p>
<p >You can <a target="_blank" href="https://tools.google.com/dlpage/gaoptout" rel="noopener">opt out of
Google Analytics</a> if you do not want Google to have access to your information.</p>
<p >Google Analytics sets the following cookies:</p>
Expand Down Expand Up @@ -100,42 +98,32 @@ <h2 class="govuk-heading-l" id="1-to-measure-website-usage">Cookies used to meas
<h3 class="heading-medium">Essential cookies</h3>
<p>These essential cookies make the service more secure. They always need to be on.</p>
<table aria-label="cookie-details" class="govuk-table">
<thead>
<tr>
<th scope="col">Cookie name</th>
<th scope="col">What this cookie is for</th>
<th scope="col">Expires after</th>
<thead class="govuk-table__head">
<tr class="govuk-table__row">
<th scope="col" class="govuk-table__header" scope="col">
Cookie name</th>
<th scope="col" class="govuk-table__header" scope="col">What this cookie is for</th>
<th scope="col" class="govuk-table__header" scope="col">Expires after</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="col">Idam.Session</th>
<td>Keeps track of your login state</td>
<td>When session ends</td>
</tr>
<tr>
<th scope="col">Idam.AuthId</th>
<td>Keeps track of your login state when using multi-factor authentication</td>
<td>When session ends</td>
</tr>
<tr>
<th scope="col">Idam.SSOSession</th>
<td>Keeps track of your login state when using federated authentication</td>
<td>When session ends</td>
<tr class="govuk-table__row" scope="col" *ngFor="let cookie of cookiesByCat(SECURITY)">
<td class="govuk-table__cell">{{cookie.name}}</td>
<td class="govuk-table__cell">{{cookie.purpose}}</td>
<td class="govuk-table__cell">{{cookie.expires}}</td>
</tr>
<tr>
<th scope="col">idam_ui_locales</th>
<td>Stores your language preferences</td>
<td>10 years</td>
<tr class="govuk-table__row" scope="col" *ngFor="let cookie of cookiesByCat(IDENTITY)">
<td class="govuk-table__cell">{{cookie.name}}</td>
<td class="govuk-table__cell">{{cookie.purpose}}</td>
<td class="govuk-table__cell">{{cookie.expires}}</td>
</tr>
<tr>
<th scope="col">XSRF-TOKEN</th>
<td>Helps protect against forgery</td>
<td>When session ends</td>
<tr class="govuk-table__row" scope="col" *ngFor="let cookie of cookiesByCat(USAGE)">
<td class="govuk-table__cell">{{cookie.name}}</td>
<td class="govuk-table__cell">{{cookie.purpose}}</td>
<td class="govuk-table__cell">{{cookie.expires}}</td>
</tr>
</tbody>
</table>
<p><a href="/cookies-policy" target="_blank" (click)="showCookiePage()">Find out more about essential cookies (opens in new tab)</a>.</p>
</table>
<form class="cookie-preferences-form">
<div class="govuk-form-group">
<fieldset class="govuk-fieldset">
Expand Down
Loading

0 comments on commit 485a291

Please sign in to comment.