feat: add example and tests (#16)

toeverything · Aug 27, 2023 · b87a7cd · b87a7cd
1 parent 765abfe
commit b87a7cd
Show file tree

Hide file tree

Showing 20 changed files with 2,018 additions and 188 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -0,0 +1,40 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'prettier',
+  ],
+  overrides: [
+    {
+      env: {
+        node: true,
+      },
+      files: ['.eslintrc.{js,cjs}'],
+      parserOptions: {
+        sourceType: 'script',
+      },
+    },
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+  },
+  plugins: ['@typescript-eslint', 'prettier'],
+  rules: {
+    'prettier/prettier': 'error',
+    '@typescript-eslint/ban-ts-comment': [
+      'error',
+      {
+        'ts-expect-error': 'allow-with-description',
+        'ts-ignore': true,
+        'ts-nocheck': true,
+        'ts-check': false,
+      },
+    ],
+  },
+};
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -1,4 +1,4 @@
-name: Build Package
+name: Build & Test
 
 on:
   push:
@@ -34,3 +34,40 @@ jobs:
 
       - name: Build
         run: sh build.sh
+
+      - uses: pnpm/action-setup@v2
+        name: Install pnpm
+        with:
+          version: latest
+          run_install: false
+
+      - name: Get pnpm store directory
+        run: |
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
+
+      - uses: actions/cache@v3
+        name: Setup pnpm cache
+        with:
+          path: ${{ env.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Use Node.js LTS
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          registry-url: https://npm.pkg.github.com
+          cache: 'pnpm'
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Lint
+        run: pnpm lint
+
+      - name: Install playwright browser
+        run: pnpm playwright install firefox
+
+      - name: Run playwright test
+        run: pnpm test -- --forbid-only
diff --git a/.gitignore b/.gitignore
@@ -6,3 +6,4 @@ wasm-pack.log
 
 node_modules/
 data/
+test-results/
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,6 @@
+{
+    "singleQuote": true,
+    "trailingComma": "es5",
+    "tabWidth": 2,
+    "arrowParens": "avoid"
+}
diff --git a/build.sh b/build.sh
@@ -26,5 +26,5 @@ echo "$(jq --argjson FILES $(ls pkg | jq -R -s -c 'split("\n")[:-1]') \
   .exports.".".import.default |= "./esm/intl_segmenter_polyfill_rs.mjs" |
   .exports.".".require.types |= "./esm/intl_segmenter_polyfill_rs.d.ts" |
   .exports.".".require.default |= "./cjs/intl_segmenter_polyfill_rs.js" |
-  .sideEffects[0] |= "./esm/intl_segmenter_polyfill_rs.js"' \
+  .sideEffects[0] |= "./esm/intl_segmenter_polyfill_rs.mjs"' \
  pkg/package.json)" > pkg/package.json
diff --git a/index.html → example/index.html b/index.html → example/index.html
@@ -6,6 +6,6 @@
   </head>
   <body>
     <noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
-    <script type="module" src="./index.js"></script>
+    <script type="module" src="./index.ts"></script>
   </body>
-</html>
+</html>
diff --git a/example/index.ts b/example/index.ts
@@ -0,0 +1,72 @@
+import * as IntlSegmeterPolyfill from 'intl-segmenter-polyfill-rs';
+
+const segmenterFr = new IntlSegmeterPolyfill.Segmenter('fr', {
+  granularity: 'word',
+});
+const string1 = 'Que ma joie demeure';
+
+const iterator1 = segmenterFr.segment(string1)[Symbol.iterator]();
+
+console.log(iterator1.next().value.segment);
+// Expected output: 'Que'
+
+console.log(iterator1.next().value.segment);
+// Expected output: ' '
+
+// Browsers like firefox
+if (Intl.Segmenter === undefined) {
+  Object.defineProperty(Intl, 'Segmenter', {
+    value: IntlSegmeterPolyfill.Segmenter,
+    configurable: true,
+    writable: true,
+  });
+  segmenterExample(true, 'sentence');
+  segmenterExample(true, 'word');
+  const spanNode2 = document.createElement('span');
+  spanNode2.innerText =
+    'You are using intl-segmenter-polyfill-rs polyfilled Intl.Segmenter.';
+  spanNode2.id = 'polyfill-status';
+  document.body.appendChild(spanNode2);
+  document.body.appendChild(document.createElement('br'));
+} else {
+  segmenterExample(false, 'sentence');
+  segmenterExample(false, 'word');
+  const spanNode2 = document.createElement('span');
+  spanNode2.innerText =
+    'You are using intl-segmenter-polyfill-rs with no polyfill applied to your browser as itself support segmenter.';
+  spanNode2.id = 'polyfill-status';
+  document.body.appendChild(spanNode2);
+  document.body.appendChild(document.createElement('br'));
+}
+
+function segmenterExample(
+  polyfilled: boolean,
+  granularity: Intl.SegmenterOptions['granularity']
+) {
+  const segmenterFr = new (polyfilled ? Intl : IntlSegmeterPolyfill).Segmenter(
+    'fr',
+    { granularity }
+  );
+  const string = 'Hello World. Xin chào thế giới!';
+  const spanNode = document.createElement('span');
+  spanNode.innerText =
+    'Splitting "' + string + '" with granularity ' + granularity + ':';
+  document.body.appendChild(spanNode);
+  document.body.appendChild(document.createElement('br'));
+
+  const iterator = segmenterFr.segment(string)[Symbol.iterator]();
+
+  const array = Array.from(iterator).map(
+    ele => (ele as IntlSegmeterPolyfill.SegmentData).segment
+  );
+
+  const list = document.createElement('ol');
+  document.body.appendChild(list);
+  array.map((seg, index) => {
+    const spanNode = document.createElement('li');
+    spanNode.id = `segmenter-${granularity}-${index}`;
+    spanNode.innerText = seg !== ' ' ? seg : '\xa0';
+    list.appendChild(spanNode);
+  });
+  document.body.appendChild(document.createElement('br'));
+}
diff --git a/example/package.json b/example/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "intl-segmenter-polyfill-example",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "intl-segmenter-polyfill-rs": "file:../pkg"
+  },
+  "devDependencies": {
+    "@swc/core": "^1.3.80",
+    "vite": "^4.4.5",
+    "vite-plugin-wasm": "^3.2.2"
+  }
+}
diff --git a/example/tsconfig.json b/example/tsconfig.json
@@ -0,0 +1,3 @@
+{
+    "extends":"../tsconfig.json"
+}