Skip to content

Commit 8919fee

Browse files
alexZajacalexZajac
committed
Updating test environment and content, removing enzyme and correcting small bugs from main component, and refreshing package.json
1 parent 132715d commit 8919fee

13 files changed

+7826
-6573
lines changed

Diff for: ‎babel.config.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = function (api) {
2+
api.cache(true)
3+
return {
4+
presets: ['babel-preset-expo', '@babel/preset-typescript'],
5+
}
6+
}

Diff for: ‎babel.config.json

-3
This file was deleted.

Diff for: ‎jest.config.json

-19
This file was deleted.

Diff for: ‎package-lock.json

+6,692-6,180
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Diff for: ‎package.json

+30-15
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,34 @@
1717
],
1818
"scripts": {
1919
"build": "tsc",
20-
"test": "jest --config jest.config.json --silent --forceExit",
20+
"test": "jest --no-watchman",
2121
"format": "prettier --write \"src/**/*.ts\" \"src/**/*.js\"",
2222
"prepare": "npm run build",
2323
"version": "npm run format && git add -A src",
2424
"postversion": "git push && git push --tags"
2525
},
26+
"jest": {
27+
"preset": "jest-expo",
28+
"setupFiles": [
29+
"./setup-test.js"
30+
],
31+
"moduleFileExtensions": [
32+
"js",
33+
"jsx",
34+
"json",
35+
"ts",
36+
"tsx"
37+
],
38+
"transform": {
39+
"^.+\\.(js|jsx|ts|tsx)$": "babel-jest"
40+
},
41+
"testMatch": [
42+
"**/*.test.ts?(x)"
43+
],
44+
"coveragePathIgnorePatterns": [
45+
"./src/__tests__/"
46+
]
47+
},
2648
"repository": {
2749
"type": "git",
2850
"url": "git+https://github.com/alexZajac/react-native-skeleton-content.git"
@@ -34,28 +56,21 @@
3456
},
3557
"homepage": "https://github.com/alexZajac/react-native-skeleton-content#readme",
3658
"devDependencies": {
37-
"@react-native-community/cli": "^2.9.0",
38-
"@types/enzyme": "^3.10.3",
39-
"@types/enzyme-adapter-react-16": "^1.0.5",
59+
"@babel/preset-typescript": "^7.10.1",
4060
"@types/jest": "^24.0.18",
4161
"@types/react": "^16.9.5",
4262
"@types/react-native": "^0.60.19",
63+
"@types/react-test-renderer": "^16.9.2",
64+
"@unimodules/react-native-adapter": "^5.2.0",
65+
"babel-preset-expo": "^8.2.1",
4366
"coveralls": "^3.0.7",
44-
"enzyme": "^3.10.0",
45-
"enzyme-adapter-react-16": "^1.15.1",
46-
"enzyme-to-json": "^3.4.2",
4767
"jest": "^24.9.0",
48-
"jest-enzyme": "^7.1.1",
49-
"jsdom": "^15.2.0",
50-
"metro": "^0.59.0",
51-
"metro-inspector-proxy": "^0.59.0",
52-
"metro-react-native-babel-preset": "^0.55.0",
68+
"jest-expo": "^37.0.0",
5369
"prettier": "^1.18.2",
5470
"react": "^16.10.2",
55-
"react-dom": "^16.10.2",
5671
"react-native": "^0.62.2",
5772
"react-native-unimodules": "^0.7.0-rc.1",
58-
"ts-jest": "^24.1.0",
73+
"react-test-renderer": "^16.13.1",
5974
"tslint": "^5.20.0",
6075
"tslint-config-prettier": "^1.18.0",
6176
"tslint-eslint-rules": "^5.4.0",
@@ -64,7 +79,7 @@
6479
},
6580
"dependencies": {
6681
"expo-linear-gradient": "^8.0.0",
67-
"lodash": "^4.17.14",
82+
"react-native-gesture-handler": "^1.6.1",
6883
"react-native-reanimated": "^1.9.0",
6984
"react-native-redash": "^14.1.1"
7085
}

Diff for: ‎setup-test-env.js

-32
This file was deleted.

Diff for: ‎setup-test.js

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
jest.mock("react-native-reanimated", () =>
2+
jest.requireActual("./node_modules/react-native-reanimated/mock"),
3+
);
4+
jest.mock('react-native-gesture-handler', () => {});

Diff for: ‎src/SkeletonContent.tsx

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import * as React from "react";
22
import { StyleSheet, View } from "react-native";
33
import { LinearGradient } from "expo-linear-gradient";
4-
import Animated from "react-native-reanimated";
4+
import Animated, { interpolate } from "react-native-reanimated";
55
import { interpolateColor, loop } from "react-native-redash";
66
import {
77
DEFAULT_ANIMATION_TYPE,
@@ -156,7 +156,7 @@ const SkeletonContent: React.FunctionComponent<ISkeletonContentProps> = ({
156156

157157
const getGradientTransform = (boneLayout: CustomViewStyle): object => {
158158
let transform = {};
159-
const interpolatedPosition = animationValue.interpolate({
159+
const interpolatedPosition = interpolate(animationValue, {
160160
inputRange: [0, 1],
161161
outputRange: getPositionRange(boneLayout),
162162
});
@@ -212,7 +212,7 @@ const SkeletonContent: React.FunctionComponent<ISkeletonContentProps> = ({
212212

213213
const getShiverBone = (layoutStyle: CustomViewStyle, key: number | string): JSX.Element => {
214214
const animatedStyle: any = { transform: [getGradientTransform(layoutStyle)] };
215-
return (<View key={layoutStyle.key || key} style={[getBoneStyles(layoutStyle), { overflow: "hidden" }]}>
215+
return (<View key={layoutStyle.key || key} style={getBoneStyles(layoutStyle)}>
216216
<Animated.View
217217
style={[
218218
styles.absoluteGradient,
@@ -237,7 +237,8 @@ const SkeletonContent: React.FunctionComponent<ISkeletonContentProps> = ({
237237
// has a nested layout
238238
if (layout[i].children && layout[i].children.length > 0) {
239239
const containerPrefix = layout[i].key || `bone_container_${i}`;
240-
return getBoneContainer(layout[i], getBones(layout[i].children, [], containerPrefix), containerPrefix);
240+
const { children, ...layoutStyle } = layout[i];
241+
return getBoneContainer(layoutStyle, getBones(layout[i].children, [], containerPrefix), containerPrefix);
241242
} else {
242243
if (
243244
animationType === "pulse" ||
@@ -252,7 +253,7 @@ const SkeletonContent: React.FunctionComponent<ISkeletonContentProps> = ({
252253
// no mayout, matching children's layout
253254
} else {
254255
return React.Children.map(children, (child, i) => {
255-
const styling = child.style || {};
256+
const styling = child.props.style || {};
256257
if (animationType === "pulse" || animationType === "none") {
257258
return getStaticBone(styling, i);
258259
} else {

0 commit comments

Comments
 (0)