test: (TilesSDK) fix issues with babel and snapshot

.github/workflows/ci.yml

@@ -0,0 +1,35 @@
+name: CI
+
+on:
+  push:
+    branches: [ master ]
+  pull_request:
+    branches: [ master ]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v4
+
+    - name: Setup Node.js
+      uses: actions/setup-node@v4
+      with:
+        node-version: 20.18.0
+        cache: 'yarn'
+
+    - name: Install dependencies
+      run: yarn install --frozen-lockfile
+
+    - name: Run tests
+      run: yarn test
+
+    - name: Type check
+      run: yarn type-check
+
+    - name: Build
+      run: yarn build
+
+    - name: Run Storybook tests
+      run: yarn test-storybook

.github/workflows/npm-publish.yml

@@ -8,7 +8,19 @@ on:
     types: [created]
 
 jobs:
+  build-and-test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20.18.0
+      - run: yarn
+      - run: yarn test
+      - run: yarn build
+
   publish-npm:
+    needs: build-and-test
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4

babel.config.js

@@ -1,19 +1,32 @@
-module.exports = {
-  presets: ['module:metro-react-native-babel-preset'],
-  plugins: [
-    ['module-resolver', {
-      alias: {
-        '^react-native$': 'react-native-web'
+module.exports = api => {
+  const isTest = api.env('test');
+
+  return {
+    presets: [
+      ['module:metro-react-native-babel-preset', { modules: false }]
+    ],
+    plugins: [
+      ['module-resolver', {
+        alias: {
+          '^react-native$': 'react-native-web'
+        }
+      }]
+    ],
+    env: {
+      test: {
+        presets: [
+          ['@babel/preset-env', { targets: { node: 'current' }, modules: 'commonjs' }],
+          '@babel/preset-typescript',
+          ['@babel/preset-react', { runtime: 'automatic' }]
+        ]
+      },
+      production: {
+        presets: [
+          ['@babel/preset-env', { modules: false }],
+          '@babel/preset-typescript',
+          ['@babel/preset-react', { runtime: 'automatic' }]
+        ]
       }
-    }]
-  ],
-  env: {
-    test: {
-      presets: [
-        ['@babel/preset-env', { targets: { node: 'current' } }],
-        '@babel/preset-typescript',
-        ['@babel/preset-react', { runtime: 'automatic' }]
-      ]
     }
-  }
+  };
 };

babel.config.rollup.js

@@ -0,0 +1,14 @@
+module.exports = {
+  presets: [
+    ['@babel/preset-env', { modules: false }],
+    '@babel/preset-typescript',
+    ['@babel/preset-react', { runtime: 'automatic' }]
+  ],
+  plugins: [
+    ['module-resolver', {
+      alias: {
+        '^react-native$': 'react-native-web'
+      }
+    }]
+  ]
+};

lib/components/organisms/PointsTile/points-tile-title.tsx

@@ -11,7 +11,12 @@ export const PointsTileTitle = (): JSX.Element | null => {
   if (!title) return null;
 
   return (
-    <View testID="points-tile-title" accessible accessibilityLabel={title}>
+    <View 
+      testID="points-tile-title" 
+      accessible 
+      accessibilityLabel={title}
+      accessibilityRole="header"
+    >
       <Text
         variant="eyebrow"
         accessibilityElementsHidden={true}

rollup.config.js

@@ -21,25 +21,27 @@ const baseConfig = {
   external,
 };
 
-module.exports = [
+export default [
   {
     ...baseConfig,
     output: {
       file: 'dist/index.js',
-      format: 'cjs',
+      format: 'esm',
       sourcemap: true,
     },
     plugins: [
       resolve({ extensions }),
       commonjs(),
       typescript({
         tsconfig: './tsconfig.json',
-        declaration: false,
-        sourceMap: true,
+        declaration: true,
+        declarationDir: './dist',
       }),
       babel({
-        babelHelpers: 'bundled',
         extensions,
+        babelHelpers: 'bundled',
+        configFile: './babel.config.rollup.js',
+        include: ['lib/**/*'],
         exclude: 'node_modules/**',
       }),
     ],