Skip to content

Commit

Permalink
Add test and lint.
Browse files Browse the repository at this point in the history
  • Loading branch information
jameswilddev committed Mar 18, 2022
1 parent 5ffcf30 commit a24957f
Show file tree
Hide file tree
Showing 2 changed files with 152 additions and 1 deletion.
139 changes: 139 additions & 0 deletions react-native/components/createButtonComponent/unit.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3884,3 +3884,142 @@ test(`renders with a right icon when the left icon is undefined`, () => {
);
expect(onPress).not.toHaveBeenCalled();
});

test(`renders with a font weight`, () => {
const Component = createButtonComponent({
fontFamily: `Example Font Family`,
fontWeight: `700`,
fontSize: 16,
horizontalPadding: 10,
verticalPadding: 2,
iconSpacing: 7,
default: {
backgroundColor: `yellow`,
color: `blue`,
radius: 25,
border: {
width: 5,
color: `aquamarine`,
},
},
disabled: {
backgroundColor: `orange`,
color: `purple`,
radius: 7,
border: {
width: 2,
color: `aquamarine`,
},
},
});
const onPress = jest.fn();

const rendered = (
<Component
leftIcon={() => null}
rightIcon={() => null}
onPress={onPress}
disabled={false}
>
Example Content
</Component>
);

expect(unwrapRenderedFunctionComponent(rendered)).toEqual(
<Hitbox
disabled={false}
onPress={onPress}
style={{
backgroundColor: `yellow`,
borderRadius: 25,
paddingHorizontal: 10,
paddingVertical: 2,
borderWidth: 5,
borderColor: `aquamarine`,
alignItems: `center`,
}}
>
<Text
style={{
color: `blue`,
fontFamily: `Example Font Family`,
fontSize: 16,
lineHeight: 22.4,
fontWeight: `700`,
}}
>
Example Content
</Text>
</Hitbox>
);
expect(onPress).not.toHaveBeenCalled();
});

test(`renders with a font weight of undefined`, () => {
const Component = createButtonComponent({
fontFamily: `Example Font Family`,
fontWeight: undefined,
fontSize: 16,
horizontalPadding: 10,
verticalPadding: 2,
iconSpacing: 7,
default: {
backgroundColor: `yellow`,
color: `blue`,
radius: 25,
border: {
width: 5,
color: `aquamarine`,
},
},
disabled: {
backgroundColor: `orange`,
color: `purple`,
radius: 7,
border: {
width: 2,
color: `aquamarine`,
},
},
});
const onPress = jest.fn();

const rendered = (
<Component
leftIcon={() => null}
rightIcon={() => null}
onPress={onPress}
disabled={false}
>
Example Content
</Component>
);

expect(unwrapRenderedFunctionComponent(rendered)).toEqual(
<Hitbox
disabled={false}
onPress={onPress}
style={{
backgroundColor: `yellow`,
borderRadius: 25,
paddingHorizontal: 10,
paddingVertical: 2,
borderWidth: 5,
borderColor: `aquamarine`,
alignItems: `center`,
}}
>
<Text
style={{
color: `blue`,
fontFamily: `Example Font Family`,
fontSize: 16,
lineHeight: 22.4,
}}
>
Example Content
</Text>
</Hitbox>
);
expect(onPress).not.toHaveBeenCalled();
});
14 changes: 13 additions & 1 deletion react-native/types/ButtonStyle/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,19 @@ export type ButtonStyle = {
/**
* The weight of the text on the button.
*/
readonly fontWeight?: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | undefined;
readonly fontWeight?:
| `normal`
| `bold`
| `100`
| `200`
| `300`
| `400`
| `500`
| `600`
| `700`
| `800`
| `900`
| undefined;

/**
* The amount of horizontal padding inside the button.
Expand Down

0 comments on commit a24957f

Please sign in to comment.