Test 추가 / 배포

tosspayments · Apr 13, 2020 · 42a15f2 · 42a15f2
1 parent 165ca30
commit 42a15f2
Show file tree

Hide file tree

Showing 6 changed files with 3,176 additions and 24 deletions.
diff --git a/jest.config.js b/jest.config.js
@@ -0,0 +1,4 @@
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+};
diff --git a/package.json b/package.json
@@ -1,23 +1,27 @@
 {
   "name": "@tossteam/payments-web",
   "description": "웹 클라이언트용 Toss Payments SDK (임시)",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "main": "dist/tosspayments.cjs.js",
   "module": "dist/tosspayments.esm.js",
   "types": "types/index.d.ts",
   "author": "Toss Payments",
   "scripts": {
-    "build": "rm -rf dist && rollup -c && tsc --emitDeclarationOnly -p tsconfig.typebuild.json"
+    "build": "rm -rf dist && rollup -c && tsc --emitDeclarationOnly -p tsconfig.typebuild.json",
+    "test": "jest"
   },
   "license": "UNLICENSED",
   "private": false,
   "devDependencies": {
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@rollup/plugin-typescript": "^3.0.0",
+    "@types/jest": "^25.2.1",
+    "jest": "^25.3.0",
     "prettier": "^2.0.2",
     "rollup": "^2.3.0",
     "rollup-plugin-babel": "^4.4.0",
+    "ts-jest": "^25.3.1",
     "tslib": "^1.11.1",
     "typescript": "^3.8.3"
   },

diff --git a/src/index.test.ts b/src/index.test.ts
@@ -0,0 +1,44 @@
+const SCRIPT_URL = '//web.tosspayments.com/sdk/alpha/tosspayments.js';
+
+function dispatchLoadEvent() {
+  // @ts-ignore
+  window.TossPayments = jest.fn();
+  document.querySelector(`script[src="${SCRIPT_URL}"]`)?.dispatchEvent(new Event('load'));
+}
+
+describe('loadTossPayments', () => {
+  afterEach(() => {
+    document.head.innerHTML = '';
+    document.body.innerHTML = '';
+    // @ts-ignore
+    delete window.TossPayments;
+  });
+
+  test('URL이 들어간 <script>를 <head>에 inject한다', async () => {
+    const { loadTossPayments } = await import('./index');
+
+    const loadPromise = loadTossPayments('test_key');
+
+    dispatchLoadEvent();
+
+    await loadPromise;
+
+    const script = document.querySelector(`script[src="${SCRIPT_URL}"]`);
+
+    expect(script).not.toBeNull();
+  });
+
+  test('2회 이상의 중복 호출 시에도 1회만 inject한다', async () => {
+    const { loadTossPayments } = await import('./index');
+
+    const loadPromise = Promise.all(Array(10).fill(loadTossPayments('test_key')));
+
+    dispatchLoadEvent();
+
+    await loadPromise;
+
+    const scripts = document.querySelectorAll(`script[src="${SCRIPT_URL}"]`);
+
+    expect(scripts).toHaveLength(1);
+  });
+});
diff --git a/src/index.ts b/src/index.ts
@@ -1,23 +1,35 @@
-const ALPHA_URL = '//web.tosspayments.com/sdk/alpha/tosspayments.js';
+const SCRIPT_URL = '//web.tosspayments.com/sdk/alpha/tosspayments.js';
 
 let cachedPromise: Promise<any> | undefined;
 
-export default async function loadTossPayments(clientKey: string): Promise<any> {
+export async function loadTossPayments(clientKey: string): Promise<any> {
   if (typeof window === 'undefined') {
     return;
   }
 
-  if (cachedPromise !== undefined) {
+  const selectedScript = document.querySelector(`script[src="${SCRIPT_URL}"]`);
+
+  if (selectedScript != null && cachedPromise !== undefined) {
     return cachedPromise;
   }
 
+  // @ts-ignore
+  if (selectedScript != null && window.TossPayments) {
+    // @ts-ignore
+    return window.TossPayments(clientKey);
+  }
+
   const script = document.createElement('script');
-  script.src = ALPHA_URL;
+  script.src = SCRIPT_URL;
+
+  cachedPromise = new Promise((resolve) => {
+    document.head.appendChild(script);
 
-  return new Promise((resolve) => {
     script.addEventListener('load', () => {
       // @ts-ignore
       resolve(window.TossPayments(clientKey));
     });
   });
+
+  return cachedPromise;
 }
diff --git a/tsconfig.json b/tsconfig.json
@@ -2,6 +2,7 @@
   "compilerOptions": {
     "target": "es2019",
     "jsx": "react",
+    "module": "esnext",
     "moduleResolution": "node",
     "declaration": true,
     "forceConsistentCasingInFileNames": true,