Merge branch 'main' into feat/jest-typescript

# Conflicts: # jest.config.js # setup-jest.js
maplibre · Oct 21, 2024 · c18c4d8 · c18c4d8
2 parents 0dd1dda + 77701aa
commit c18c4d8
Show file tree

Hide file tree

Showing 118 changed files with 3,218 additions and 3,827 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -0,0 +1,5 @@
+module.exports = {
+  root: true,
+  extends: ["universe/native"],
+  ignorePatterns: ["build"],
+};
diff --git a/.git-blame-ignore-revs b/.git-blame-ignore-revs
@@ -0,0 +1,3 @@
+# style: apply formatting via lint:fix
+# https://github.com/maplibre/maplibre-react-native/pull/467
+017b3861ae8ac856a3b032ebea6497eff4420e1f
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -18,11 +18,10 @@ Added `your feature` that allows ...
 <!-- Check completed item: [X] -->
 
 - [ ] I have tested this on a device/simulator for each compatible OS
-- [ ] I formatted JS and TS files with running `yarn lint:fix` in the root folder
+- [ ] I formatted JS and TS files with running `yarn lint:eslint:fix` in the root folder
 - [ ] I have run tests via `yarn test` in the root folder
 - [ ] I updated the documentation with running `yarn generate` in the root folder
 - [ ] I mentioned this change in `CHANGELOG.md`
-- [ ] I updated the typings files (`index.d.ts`)
 - [ ] I added/updated a sample (`/example`)
 
 ## Screenshot OR Video

diff --git a/.github/workflows/on-push.yml b/.github/workflows/on-push.yml
@@ -24,14 +24,14 @@ jobs:
       - name: Install
         run: yarn install --immutable --check-cache
 
-      - name: Lint
-        run: yarn lint
+      - name: Lint with ESLint
+        run: yarn lint:eslint
 
-      - name: Typescript check
-        run: yarn typescript:check
+      - name: Lint with TSC
+        run: yarn lint:tsc
 
-      - name: Test
-        run: yarn unittest
+      - name: Run test with Jest
+        run: yarn test
 
       - name: Generate
         run: yarn generate

diff --git a/__tests__/__mocks__/react-native.mock.js b/__tests__/__mocks__/react-native.mock.js
@@ -1,14 +1,16 @@
-jest.mock('react-native/Libraries/Image/resolveAssetSource', () => {
-  return () => ({uri: 'asset://test.png'});
+jest.mock("react-native/Libraries/Image/resolveAssetSource", () => {
+  return () => ({ uri: "asset://test.png" });
 });
 
-jest.mock('react-native/Libraries/EventEmitter/NativeEventEmitter', () => {
+jest.mock("react-native/Libraries/EventEmitter/NativeEventEmitter", () => {
   function MockEventEmitter() {}
-  MockEventEmitter.prototype.addListener = jest.fn(() => ({remove: jest.fn()}));
+  MockEventEmitter.prototype.addListener = jest.fn(() => ({
+    remove: jest.fn(),
+  }));
   return {
     __esModule: true,
     default: MockEventEmitter,
   };
 });
 
-jest.mock('react-native/Libraries/Animated/NativeAnimatedHelper');
+jest.mock("react-native/Libraries/Animated/NativeAnimatedHelper");
diff --git a/__tests__/components/BackgroundLayer.test.js b/__tests__/components/BackgroundLayer.test.js
@@ -1,37 +1,37 @@
-import React from 'react';
-import {render} from '@testing-library/react-native';
+import { render } from "@testing-library/react-native";
+import React from "react";
 
-import BackgroundLayer from '../../javascript/components/BackgroundLayer';
+import BackgroundLayer from "../../javascript/components/BackgroundLayer";
 
-describe('BackgroundLayer', () => {
-  test('renders correctly with default props', () => {
-    const {queryByTestId} = render(
+describe("BackgroundLayer", () => {
+  test("renders correctly with default props", () => {
+    const { queryByTestId } = render(
       <BackgroundLayer id="requiredBackgroundLayerID" />,
     );
 
-    const backgroundLayer = queryByTestId('rctmlnBackgroundLayer');
-    const {props} = backgroundLayer;
+    const backgroundLayer = queryByTestId("rctmlnBackgroundLayer");
+    const { props } = backgroundLayer;
 
-    expect(props.sourceID).toStrictEqual('DefaultSourceID');
+    expect(props.sourceID).toStrictEqual("DefaultSourceID");
   });
 
-  test('renders correctly with custom props', () => {
+  test("renders correctly with custom props", () => {
     const testProps = {
-      id: 'customId',
-      sourceID: 'customSourceId',
-      sourceLayerID: 'customSourceLayerId',
-      aboveLayerID: 'customAboveLayerId',
-      belowLayerID: 'customBelowLayerId',
+      id: "customId",
+      sourceID: "customSourceId",
+      sourceLayerID: "customSourceLayerId",
+      aboveLayerID: "customAboveLayerId",
+      belowLayerID: "customBelowLayerId",
       layerIndex: 0,
-      filter: ['==', 'arbitraryFilter', true],
+      filter: ["==", "arbitraryFilter", true],
       minZoomLevel: 3,
       maxZoomLevel: 8,
-      style: {visibility: 'none'},
+      style: { visibility: "none" },
     };
 
-    const {queryByTestId} = render(<BackgroundLayer {...testProps} />);
-    const backgroundLayer = queryByTestId('rctmlnBackgroundLayer');
-    const {props} = backgroundLayer;
+    const { queryByTestId } = render(<BackgroundLayer {...testProps} />);
+    const backgroundLayer = queryByTestId("rctmlnBackgroundLayer");
+    const { props } = backgroundLayer;
 
     expect(props.id).toStrictEqual(testProps.id);
     expect(props.sourceID).toStrictEqual(testProps.sourceID);
@@ -44,8 +44,8 @@ describe('BackgroundLayer', () => {
     expect(props.maxZoomLevel).toStrictEqual(testProps.maxZoomLevel);
     expect(props.reactStyle).toStrictEqual({
       visibility: {
-        styletype: 'constant',
-        stylevalue: {type: 'string', value: testProps.style.visibility},
+        styletype: "constant",
+        stylevalue: { type: "string", value: testProps.style.visibility },
       },
     });
   });

diff --git a/__tests__/components/Callout.test.js b/__tests__/components/Callout.test.js
@@ -1,41 +1,41 @@
-import React from 'react';
-import {render} from '@testing-library/react-native';
-import {View} from 'react-native';
+import { render } from "@testing-library/react-native";
+import React from "react";
+import { View } from "react-native";
 
-import Callout from '../../javascript/components/Callout';
+import Callout from "../../javascript/components/Callout";
 
-describe('Callout', () => {
-  test('renders with custom title', () => {
-    const testTitle = 'test title';
-    const {getByText} = render(<Callout {...{title: testTitle}} />);
+describe("Callout", () => {
+  test("renders with custom title", () => {
+    const testTitle = "test title";
+    const { getByText } = render(<Callout {...{ title: testTitle }} />);
 
     expect(getByText(testTitle)).toBeDefined();
   });
 
-  describe('_renderDefaultCallout', () => {
-    test('renders default children', () => {
-      const {getByTestId} = render(<Callout />);
+  describe("_renderDefaultCallout", () => {
+    test("renders default children", () => {
+      const { getByTestId } = render(<Callout />);
 
-      expect(getByTestId('callout')).toBeDefined();
-      expect(getByTestId('title')).toBeDefined();
-      expect(getByTestId('container')).toBeDefined();
+      expect(getByTestId("callout")).toBeDefined();
+      expect(getByTestId("title")).toBeDefined();
+      expect(getByTestId("container")).toBeDefined();
     });
 
-    test('renders with custom styles', () => {
+    test("renders with custom styles", () => {
       const testProps = {
-        style: {height: 1},
-        containerStyle: {height: 2},
-        contentStyle: {height: 3},
-        tipStyle: {height: 4},
-        textStyle: {height: 5},
+        style: { height: 1 },
+        containerStyle: { height: 2 },
+        contentStyle: { height: 3 },
+        tipStyle: { height: 4 },
+        textStyle: { height: 5 },
       };
-      const {getByTestId} = render(<Callout {...testProps} />);
+      const { getByTestId } = render(<Callout {...testProps} />);
 
-      const callout = getByTestId('callout');
-      const container = getByTestId('container');
-      const wrapper = getByTestId('wrapper');
-      const tip = getByTestId('tip');
-      const title = getByTestId('title');
+      const callout = getByTestId("callout");
+      const container = getByTestId("container");
+      const wrapper = getByTestId("wrapper");
+      const tip = getByTestId("tip");
+      const title = getByTestId("title");
 
       const calloutWrapperTestStyle = callout.props.style[0].height;
       const animatedViewTestStyle = container.props.style.height;
@@ -53,30 +53,30 @@ describe('Callout', () => {
     });
   });
 
-  describe('_renderCustomCallout', () => {
-    test('renders custom children', () => {
-      const {getByTestId, queryByTestId} = render(
+  describe("_renderCustomCallout", () => {
+    test("renders custom children", () => {
+      const { getByTestId, queryByTestId } = render(
         <Callout>
-          <View testID="TestChild">{'Foo Bar'}</View>
+          <View testID="TestChild">Foo Bar</View>
         </Callout>,
       );
 
-      expect(queryByTestId('title')).toBeNull();
-      expect(getByTestId('TestChild')).toBeDefined();
+      expect(queryByTestId("title")).toBeNull();
+      expect(getByTestId("TestChild")).toBeDefined();
     });
 
-    test('renders with custom styles', () => {
+    test("renders with custom styles", () => {
       const testProps = {
-        style: {width: 1},
-        containerStyle: {width: 2},
+        style: { width: 1 },
+        containerStyle: { width: 2 },
       };
-      const {getByTestId} = render(
+      const { getByTestId } = render(
         <Callout {...testProps}>
-          <View>{'Foo Bar'}</View>
+          <View>Foo Bar</View>
         </Callout>,
       );
-      const callout = getByTestId('callout');
-      const view = getByTestId('container');
+      const callout = getByTestId("callout");
+      const view = getByTestId("container");
 
       const calloutWrapperTestStyle = callout.props.style[0].width;
       const animatedViewTestStyle = view.props.style.width;