Release 1/6/24

README.md

@@ -6,6 +6,8 @@ This repository contains the code used to redesign the existing "Claim Status" a
 
 JavaScript scripts are injected onto the existing application and manually update the layout and content for a better user experience. Rather than updating the existing JSP code directly, this will enable frequent testing on dev and deployments to prod without OIM as a dependency, both in terms of infrastructure and bandwidth. See `CHANGELOG.md` for list of updates made to production.
 
+The script files are hosted on the `beta.nj.gov` domain and automatically pushed from the `beta` Github repository. This repository houses the code and tests for developing the scripts, while the `beta` repository simply houses the compiled assets that need to be hosted. Note that there is a `dev` and `prod` hosting of the scripts, which corresponds to the dev and prod (https://secure.dol.state.nj.us/DOL_DABI/) versions of the Claim Status application.
+
 ## Setup
 
 1. Clone this `paid-leave-claim-status` repository
@@ -14,9 +16,21 @@ JavaScript scripts are injected onto the existing application and manually updat
 4. Run `npm run build` to build bundled files
 5. Run `npm test` to run Cypress tests
 
+## Development
+
+When you make a change and want to see if everything is working, do the following:
+
+1. Edit `.js` file in `src/` directory (edit corresponding Cypress test if relevant)
+2. Run `npm run build` to compile files
+3. Run `npm test` to ensure tests still pass
+4. Open relevant test file in `cypress/fixtures` in browser to ensure change looks okay (edit or add new test file if your scenario is not covered)
+5. After code review, push changes to `dev` branch. This will automatically deploy test files on Github pages under the URL https://newjersey.github.io/paid-leave-claim-status/... These test links can be used to share the view under specific claim scenarios with your team.
+6. After the test links have been reviewed, deploy the changes to the dev site. See instructions below for deployment. Reach out to your OOI team or the Department of Labor to get the Claim Status dev URL.
+
 ## Deployment
 
-1. Clone the `beta` repository in the same local folder that the `paid-leave-claim-status` folder is in
-2. Run `npm run build` to build latest files into bundle
-3. Run `npm run prep-deploy-dev` (or `prep-deploy-prod` based on intended stage), which should copy the files into the correct `beta` directory
-4. Push files to `main` branch of `beta` repo, and they will be automatically deployed to `beta.nj.gov` to be referenced by the Claim Status application
+1. In `paid-leave-claim-status` repository, create a PR to squash & merge changes from `dev` into `prod`. Note that this change does not directly affect deployment, it is just to keep the change history log up to date.
+2. Clone the `beta` repository in the same local directory where the local files for the `paid-leave-claim-status` repo live.
+3. Use Node 20 and `npm run build` to build latest files into bundle.
+4. Run `npm run prep-deploy-dev` (or `prep-deploy-prod` based on intended stage), which should copy the files into the correct `beta` directory
+5. Push files to `main` branch of `beta` repo, and they will be automatically deployed to `beta.nj.gov` to be referenced by the Claim Status application

build.sh

@@ -12,5 +12,6 @@ echo "Copying bundled scripts to Cypress test assets..."
 cp dist/noRecordFound.min.js cypress/fixtures/noRecordFound/noRecordFound.min.js
 cp dist/claimDetail.min.js cypress/fixtures/claimDetail/claimDetail.min.js
 cp dist/claimList.min.js cypress/fixtures/claimList/claimList.min.js
+cp dist/paymentDetail.min.js cypress/fixtures/paymentDetail/paymentDetail.min.js
 
 echo "Complete!"

cypress/e2e/claimDetailEligible.cy.js

@@ -32,17 +32,14 @@ describe("Claim Detail page - Eligible scenario with next pay date", () => {
     cy.contains("Weekly benefit rate")
       .contains("$1,025.00")
       .should("be.visible");
-    cy.contains("Paid through date")
-      .contains("September 14, 2023")
-      .should("be.visible");
     cy.contains("Balance remaining")
       .contains("$20,649.00")
       .should("be.visible");
     cy.contains("Leave start date")
       .contains("August 5, 2023")
       .should("be.visible");
     cy.contains("Leave end date")
-      .contains("December 1, 2023")
+      .contains("December 1, 2025")
       .should("be.visible");
   });
 
@@ -78,7 +75,6 @@ describe("Claim Detail page - Eligible scenario without next pay date", () => {
       .contains("Go to payment information")
       .should("have.attr", "onclick")
       .and("equal", "paymentDetail()");
-    cy.contains("Your payment is still processing.").should("be.visible");
     cy.get("li")
       .contains(
         "Payment is usually sent to your benefits debit card a few days after you're approved."
@@ -93,9 +89,6 @@ describe("Claim Detail page - Eligible scenario without next pay date", () => {
     cy.contains("Weekly benefit rate")
       .contains("$1,025.00")
       .should("be.visible");
-    cy.contains("Paid through date")
-      .contains("September 14, 2023")
-      .should("be.visible");
     cy.contains("Balance remaining")
       .contains("$20,649.00")
       .should("be.visible");
@@ -112,3 +105,103 @@ describe("Claim Detail page - Eligible scenario without next pay date", () => {
     cy.checkBodyA11y();
   });
 });
+
+describe("Claim Detail page - Eligible scenario with next pay date", () => {
+  it("renders with updated content", () => {
+    cy.visit("./cypress/fixtures/claimDetail/claimDetailEligible.html");
+
+    cy.contains("Eligible").should("not.exist"); // Rendered on original HTML, without script change
+
+    cy.get("h1").contains("Status").should("be.visible");
+
+    cy.get(".complete.received")
+      .contains("August 10, 2023")
+      .should("be.visible");
+    cy.get(".complete").contains("Review").should("be.visible");
+    cy.get(".complete").contains("Decision").should("be.visible");
+    cy.get(".end.current").contains("Payment").should("be.visible");
+
+    cy.contains("Claim for Temporary Disability Insurance (TDI)").should(
+      "be.visible"
+    );
+    cy.contains("leave starting August 5, 2023").should("be.visible");
+    cy.contains("Approved").should("be.visible");
+    cy.get("button")
+      .contains("Go to payment information")
+      .should("have.attr", "onclick")
+      .and("equal", "paymentDetail()");
+    cy.contains("Your next payment is scheduled for").should("be.visible");
+    cy.contains("November 22, 2023").should("be.visible");
+    cy.get("li")
+      .contains(
+        "You'll keep getting paid. We'll post here if anything changes."
+      )
+      .should("be.visible");
+    cy.contains("Weekly benefit rate")
+      .contains("$1,025.00")
+      .should("be.visible");
+    cy.contains("Balance remaining")
+      .contains("$20,649.00")
+      .should("be.visible");
+    cy.contains("Leave start date")
+      .contains("August 5, 2023")
+      .should("be.visible");
+    cy.contains("Leave end date")
+      .contains("December 1, 2025")
+      .should("be.visible");
+  });
+
+  it("passes accessibility checks", () => {
+    cy.visit("./cypress/fixtures/claimDetail/claimDetailEligible.html");
+    cy.checkBodyA11y();
+  });
+});
+
+describe("Claim Detail page - Eligible scenario after claim ended", () => {
+  it("renders with updated content", () => {
+    cy.visit("./cypress/fixtures/claimDetail/claimDetailEligibleEnded.html");
+
+    cy.contains("Eligible").should("not.exist"); // Rendered on original HTML, without script change
+
+    cy.get("h1").contains("Status").should("be.visible");
+
+    cy.get(".complete.received")
+      .contains("August 10, 2023")
+      .should("be.visible");
+    cy.get(".complete").contains("Review").should("be.visible");
+    cy.get(".complete").contains("Decision").should("be.visible");
+    cy.get(".end.current").contains("Payment").should("be.visible");
+
+    cy.contains("Claim for Temporary Disability Insurance (TDI)").should(
+      "be.visible"
+    );
+    cy.contains("leave starting August 5, 2023").should("be.visible");
+    cy.contains("Approved").should("be.visible");
+    cy.get("button")
+      .contains("Go to payment information")
+      .should("have.attr", "onclick")
+      .and("equal", "paymentDetail()");
+    cy.contains("Your claim has ended.").should("be.visible");
+    cy.contains(
+      "Payment is usually sent to your benefits debit card a few days after you're approved."
+    ).should("not.exist");
+
+    cy.contains("Weekly benefit rate")
+      .contains("$1,025.00")
+      .should("be.visible");
+    cy.contains("Balance remaining")
+      .contains("$20,649.00")
+      .should("be.visible");
+    cy.contains("Leave start date")
+      .contains("August 5, 2023")
+      .should("be.visible");
+    cy.contains("Leave end date")
+      .contains("December 1, 2023")
+      .should("be.visible");
+  });
+
+  it("passes accessibility checks", () => {
+    cy.visit("./cypress/fixtures/claimDetail/claimDetailEligibleEnded.html");
+    cy.checkBodyA11y();
+  });
+});