fix: merge with session fix

src/common/network.ts

@@ -8,19 +8,29 @@ import { ACH_IFRAME, CARD_IFRAME, CASH_IFRAME, ElementTypes } from './data';
 
 const sessionKey = self.crypto.randomUUID();
 
-export const getData = async (url: string, apiKey: string) => {
- const options: RequestInit = {
- method: 'GET',
- mode: 'cors',
- cache: 'no-cache',
- headers: {
- 'x-api-key': apiKey,
- 'x-session-key': sessionKey,
- },
- };
- /* global fetch */
- const response = await fetch(url, options);
- return await response.json();
+const sessionId = self.crypto.randomUUID();
+
+export const getData = async (url: string,
+ apiKey: string,
+ sessionKey: string | null) => {
+ // Validate that the session key is generated by crypto.randomUUID
+ // If it is not, set it to null
+ if (sessionKey && !sessionKey.match(/^[0-9a-f]{8}-[0-9a-f]{4}-4[0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/)) {
+ sessionKey = null;
+ }
+
+ const options: RequestInit = {
+ method: 'GET',
+ mode: 'cors',
+ cache: 'no-cache',
+ headers: {
+ 'x-api-key': apiKey,
+ 'x-session-key': sessionKey || sessionId,
+ },
+ };
+ /* global fetch */
+ const response = await fetch(url, options);
+ return await response.json();
 };
 
 export const PARTNER = process.env.ENV;
@@ -35,22 +45,23 @@ export const hostedFieldsEndpoint = `https://${ENVIRONMENT}.tags.static.${STAGE}
 export const hostedCheckoutEndpoint = `https://${ENVIRONMENT}.checkout.${STAGE}.com`;
 
 export const fetchPtToken = async (
- apiKey: string,
+ apiKey: string,
+ sessionKey?: string | null
 ): Promise<
- | {
-  'pt-token': string;
-  origin: string;
-  challengeOptions: object;
- }
- | false
+  | {
+ 'pt-token': string;
+ origin: string;
+ challengeOptions: object;
+}
+  | false
 > => {
- for (let i = 0; i < 5; i++) {
- const token = await getData(transactionEndpoint, apiKey);
- if (token['pt-token']) {
- return token;
+ for (let i = 0; i < 5; i++) {
+ const token = await getData(transactionEndpoint, apiKey, sessionKey);
+ if (token['pt-token']) {
+ return token;
+ }
  }
- }
- return false;
+ return false;
 };
 
 const sendTransactingMessageToField = (

src/common/pay_theory_types.ts

@@ -169,7 +169,7 @@ export type PayTheoryPaymentFieldsInput = {
  metadata?: { [key: string | number]: string | number | boolean };
  placeholders?: PlaceholderObject;
  elementIds?: typeof defaultElementIds;
- session?: string;
+ session?: string; // This is used for internal use to connect a button and qr code to a hosted checkout page
  feeMode?: typeof MERCHANT_FEE | typeof SERVICE_FEE;
  amount?: number;
 };

src/components/pay-theory-hosted-field-transactional/index.ts

@@ -153,7 +153,7 @@ class PayTheoryHostedFieldTransactional extends PayTheoryHostedField {
  type: `pt-static:connection_token` | `pt-static:reset_host`,
  ): Promise<ErrorResponse | ReadyResponse> {
  try {
- const ptToken = await common.fetchPtToken(this._apiKey!);
+ const ptToken = await common.fetchPtToken(this._apiKey!, this._session);
  if (ptToken) {
  this._challengeOptions = ptToken['challengeOptions'];
  const transactingIFrame = document.getElementById(