Skip to content

Unit testing #83

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 9 commits into
base: master
Choose a base branch
from
Open

Unit testing #83

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
6c344b8
[unit-testing] working on theme config testing
dheeraj1429 Oct 3, 2025
a7218d1
[unit-testing] added theme config text component test cases
dheeraj1429 Oct 4, 2025
38ae5aa
[unit-testing] Added badge component test cases
dheeraj1429 Oct 4, 2025
7ca1374
[unit-testing] added type check
dheeraj1429 Oct 4, 2025
58b9a31
[unit-testing] updated the workflows
dheeraj1429 Oct 4, 2025
1ae6923
[unit-testing] Updated git workflows
dheeraj1429 Oct 4, 2025
51d0ec6
[unit-testing] Fixed divider component orientation and spacing issue
dheeraj1429 Oct 5, 2025
03cf645
[unit-testing] Added theme badge config test cases
dheeraj1429 Oct 5, 2025
de6f580
[unit-testing] Added icon input theme config test cases
dheeraj1429 Oct 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 9 additions & 7 deletions .github/workflows/code-check.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
name: Code Quality Check
name: Code Check
on:
push:
branches:
Expand All @@ -7,7 +7,7 @@ on:
types: [opened, synchronize, reopened]
jobs:
code-quality-check:
name: Checks code quality
name: Code check
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
Expand All @@ -19,8 +19,10 @@ jobs:
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

- name: SonarCloud Scan
uses: sonarsource/sonarcloud-github-action@v2
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
- name: Run ESLint
run: yarn run lint
continue-on-error: false

- name: Run unit tests
run: yarn run test --coverage --forceExit --maxWorkers=2
continue-on-error: false
26 changes: 0 additions & 26 deletions .github/workflows/lint.yml
View file
Open in desktop

This file was deleted.

12 changes: 7 additions & 5 deletions .github/workflows/test-runner.yaml → .github/workflows/sonar-qube.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
name: Test
name: Sonarqube
on:
push:
branches:
Expand All @@ -7,7 +7,7 @@ on:
types: [opened, synchronize, reopened]
jobs:
code-quality-check:
name: Test Runner
name: Sonar code quality check
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
Expand All @@ -19,6 +19,8 @@ jobs:
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

- name: Run unit tests
run: yarn run test --coverage --forceExit --maxWorkers=2
continue-on-error: false
- name: SonarCloud Scan
uses: sonarsource/sonarcloud-github-action@v2
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
24 changes: 0 additions & 24 deletions .github/workflows/type-check.yaml
View file
Open in desktop

This file was deleted.

3 changes: 2 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
"lint": "eslint .",
"start": "react-native start",
"test": "jest --coverage",
"sonar-scanner": "sonar-scanner"
"sonar-scanner": "sonar-scanner",
"type-check": "npx tsc --noEmit"
},
"dependencies": {
"lodash": "^4.17.21",
Expand Down
46 changes: 0 additions & 46 deletions src/packages/react-native-material-elements/__test__/Card.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,29 +43,6 @@ describe('Card Component', () => {
expect(flattenedStyle.borderWidth).toEqual(0.5);
expect(flattenedStyle.borderColor).toEqual(gray[500]);
});

it('should apply the root style', () => {
const { getByTestId } = testRenderer(
<ThemeProvider components={{ cardProps: { style: { backgroundColor: 'red' } } }}>
<Card variation="outlined" testID={mockCardTestId} />
</ThemeProvider>,
);
const card = getByTestId(mockCardTestId);
const flattenedStyle = StyleSheet.flatten(card.props.style);
expect(flattenedStyle.backgroundColor).toEqual('red');
});

it('should combine the root style and component style', () => {
const { getByTestId } = testRenderer(
<ThemeProvider components={{ cardProps: { style: { backgroundColor: 'red' } } }}>
<Card variation="outlined" testID={mockCardTestId} style={{ borderWidth: 2 }} />
</ThemeProvider>,
);
const card = getByTestId(mockCardTestId);
const flattenedStyle = StyleSheet.flatten(card.props.style);
expect(flattenedStyle.backgroundColor).toEqual('red');
expect(flattenedStyle.borderWidth).toEqual(2);
});
});

describe('CardHeader Component', () => {
Expand Down Expand Up @@ -98,29 +75,6 @@ describe('CardHeader Component', () => {
const flattenedStyle = StyleSheet.flatten(cardHeader.props.style);
expect(flattenedStyle.backgroundColor).toEqual('red');
});

it('should apply the root style', () => {
const { getByTestId } = testRenderer(
<ThemeProvider components={{ cardHeaderProps: { style: { backgroundColor: 'red' } } }}>
<CardHeader testID={mockCardHeaderTestId} />
</ThemeProvider>,
);
const cardHeader = getByTestId(mockCardHeaderTestId);
const flattenedStyle = StyleSheet.flatten(cardHeader.props.style);
expect(flattenedStyle.backgroundColor).toEqual('red');
});

it('should combine the root style and component style', () => {
const { getByTestId } = testRenderer(
<ThemeProvider components={{ cardHeaderProps: { style: { backgroundColor: 'red' } } }}>
<CardHeader testID={mockCardHeaderTestId} style={{ borderWidth: 2 }} />
</ThemeProvider>,
);
const cardHeader = getByTestId(mockCardHeaderTestId);
const flattenedStyle = StyleSheet.flatten(cardHeader.props.style);
expect(flattenedStyle.backgroundColor).toEqual('red');
expect(flattenedStyle.borderWidth).toEqual(2);
});
});

describe('CardContent Component', () => {
Expand Down
158 changes: 0 additions & 158 deletions src/packages/react-native-material-elements/__test__/Dialog.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -300,164 +300,6 @@ const textTests = (Component: any, componentName: string) => {
expect(caughtError?.message).toContain('maxLength props must be used with string');
});

it('should apply the gutterBottomSpace property from theme provider', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider components={{ textProps: { gutterBottomSpace: 20 } }}>
<Component testID={mockTestId} gutterBottom>
Mock label
</Component>
</ThemeProvider>,
);
const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(expect.objectContaining({ marginBottom: 20 }));
});

it('should override the root gutterBottomSpace property', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider components={{ textProps: { gutterBottomSpace: 20 } }}>
<Component testID={mockTestId} gutterBottom overrideRootGutterBottomConfig gutterBottomSpace={10}>
Mock label
</Component>
</ThemeProvider>,
);
const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(expect.objectContaining({ marginBottom: 10 }));
});

it('should apply the maxLength property from theme provider', () => {
const { getByText } = testingRenderer(
<ThemeProvider components={{ textProps: { maxLength: 10 } }}>
<Component>Sample Text</Component>
</ThemeProvider>,
);
expect(getByText('Sample Tex...')).toBeTruthy();
});

it('should override the root maxLength property', () => {
const { getByText } = testingRenderer(
<ThemeProvider components={{ textProps: { maxLength: 10 } }}>
<Component maxLength={5}>Sample Text</Component>
</ThemeProvider>,
);
expect(getByText('Sampl...')).toBeTruthy();
});

it('should apply the root errorColor property', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider components={{ textProps: { errorColor: 'green' } }}>
<Component testID={mockTestId} error>
Sample Text
</Component>
</ThemeProvider>,
);

const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(expect.objectContaining({ color: 'green' }));
});

it('should override the root errorColor property', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider components={{ textProps: { errorColor: 'green' } }}>
<Component testID={mockTestId} error errorColor={'red'}>
Sample Text
</Component>
</ThemeProvider>,
);

const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(expect.objectContaining({ color: 'red' }));
});

it('should apply the root activeColor property', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider components={{ textProps: { activeColor: 'green' } }}>
<Component testID={mockTestId} isActive>
Sample Text
</Component>
</ThemeProvider>,
);

const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(expect.objectContaining({ color: 'green' }));
});

it('should override the root activeColor property', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider components={{ textProps: { activeColor: 'green' } }}>
<Component testID={mockTestId} isActive activeColor={'red'}>
Sample Text
</Component>
</ThemeProvider>,
);

const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(expect.objectContaining({ color: 'red' }));
});

it('should override the root color property', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider components={{ textProps: { color: 'green' } }}>
<Component testID={mockTestId} color={'red'}>
Sample Text
</Component>
</ThemeProvider>,
);

const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(expect.objectContaining({ color: 'red' }));
});

it('should apply the root styles', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider
components={{
textProps: {
style: {
fontSize: 20,
fontWeight: 'bold',
},
},
}}>
<Component testID={mockTestId}>Sample text</Component>
</ThemeProvider>,
);

const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(
expect.objectContaining({
fontSize: 20,
fontWeight: 'bold',
}),
);
});

it('should merge the root styles and component styles', () => {
const { getByTestId } = testingRenderer(
<ThemeProvider
components={{
textProps: {
style: {
fontSize: 20,
fontWeight: 'bold',
},
},
}}>
<Component testID={mockTestId} style={{ color: 'green' }}>
Sample text
</Component>
</ThemeProvider>,
);

const text = getByTestId(mockTestId);
expect(text.props.style).toEqual(
expect.objectContaining({
fontSize: 20,
fontWeight: 'bold',
color: 'green',
}),
);
});

Object.entries(themeVariants).forEach(([variant, expectedStyle]) => {
it(`should apply the '${variant}' text theme variant`, () => {
const { getByTestId } = render(
Expand Down
Loading
Loading