diff --git a/client/src/components/PayBill.jsx b/client/src/components/PayBill.jsx
index cbcfca1..34f536e 100644
--- a/client/src/components/PayBill.jsx
+++ b/client/src/components/PayBill.jsx
@@ -121,7 +121,7 @@ const PayBill = (props) => {
               return (<BillCard info={info} index={index} onClick={onChange} />);
             })}
           </div>
-          <div ref={paypal} />
+          <div ref={paypal} id="paypal-btn" />
         </div>
       }
       {submit && <ThankYou />}
diff --git a/package-lock.json b/package-lock.json
index 04cdb05..eb9f3a7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10033,6 +10033,24 @@
         "scheduler": "^0.20.2"
       }
     },
+    "react-fast-compare": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
+      "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==",
+      "dev": true
+    },
+    "react-helmet": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz",
+      "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==",
+      "dev": true,
+      "requires": {
+        "object-assign": "^4.1.1",
+        "prop-types": "^15.7.2",
+        "react-fast-compare": "^3.1.1",
+        "react-side-effect": "^2.1.0"
+      }
+    },
     "react-is": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
@@ -10100,6 +10118,12 @@
         "react-is": "^16.12.0 || ^17.0.0"
       }
     },
+    "react-side-effect": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.1.tgz",
+      "integrity": "sha512-2FoTQzRNTncBVtnzxFOk2mCpcfxQpenBMbk5kSVBg5UcPqV9fRbgY2zhb7GTWWOlpFmAxhClBDlIq8Rsubz1yQ==",
+      "dev": true
+    },
     "react-test-renderer": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-17.0.2.tgz",
diff --git a/package.json b/package.json
index dcbea08..ec56023 100644
--- a/package.json
+++ b/package.json
@@ -59,6 +59,7 @@
     "jest": "^27.2.0",
     "jest-dom": "^4.0.0",
     "nodemon": "^2.0.12",
+    "react-helmet": "^6.1.0",
     "webpack": "^5.53.0",
     "webpack-cli": "^4.8.0"
   },
diff --git a/tests/paybill.test.js b/tests/paybill.test.js
new file mode 100644
index 0000000..817b53d
--- /dev/null
+++ b/tests/paybill.test.js
@@ -0,0 +1,34 @@
+import { render, screen, cleanup } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import React from 'react';
+import PayBill from '../client/src/components/PayBill.jsx';
+import { Helmet } from "react-helmet";
+afterEach(cleanup);
+
+
+
+describe('Paybill page can render properly', () => {
+  test('can render page correctly', () => {
+    let hostInfo = {
+      email: "sb-dmus17722352@personal.example.com",
+      guestName: "Ming Ma",
+      id: 133
+    }
+    let finalTotals = {
+      paymentsOwed: {
+        "Ming Ma": 32.1,
+        "Sara": 37.3,
+        "Milo": 30.1
+      }
+    }
+    render(
+      <div>
+        <Helmet>
+          <script
+            src="https://www.paypal.com/sdk/js?client-id=AcuzwYns3SuSSdJfwStMFCPsnRV3Ohu3ebkRskSvHlnR0p3UXVuhIcMbdUXpsBY6ISfepv7yQ2YQtpCC" />
+          <PayBill finalTotals={finalTotals} hostInfo={hostInfo} />
+        </Helmet>);
+      </div>
+    )
+  })
+})