Skip to content

Instantly share code, notes, and snippets.

@cdbkr
Last active May 14, 2019 14:07
Show Gist options
  • Save cdbkr/c66ad2868de8013e6e28e3317699b091 to your computer and use it in GitHub Desktop.
Save cdbkr/c66ad2868de8013e6e28e3317699b091 to your computer and use it in GitHub Desktop.
import {
render,
fireEvent,
cleanup
} from 'vue-testing-library';
import Counter, { INITIAL_COUNTER } from '@/components/Counter.vue'
describe('Component: Counter.vue', () => {
describe('Behavior', () => {
afterEach(() => {
cleanup();
});
test('User should see 0 at the beginning', () => {
const { getByText } = render(Counter);
const textNumberWrapper = getByText(/Counter is:/);
expect(textNumberWrapper).toHaveTextContent('Counter is: 0');
});
test('When User clicks on Increase, Counter should be increased by 1 unit', async () => {
const { getByText } = render(Counter);
const textNumberWrapper = getByText(/Counter is:/);
expect(textNumberWrapper).toHaveTextContent(`Counter is: ${INITIAL_COUNTER}`);
await fireEvent.click(getByText('Increase'));
expect(textNumberWrapper).toHaveTextContent(`Counter is: ${INITIAL_COUNTER + 1}`);
});
test('When User clicks on Decrease, Counter should be decreased by 1 unit', async () => {
const { getByText } = render(Counter);
const textNumberWrapper = getByText(/Counter is:/);
expect(textNumberWrapper).toHaveTextContent(`Counter is: ${INITIAL_COUNTER}`);
await fireEvent.click(getByText('Decrease'));
expect(textNumberWrapper).toHaveTextContent(`Counter is: ${INITIAL_COUNTER - 1}`);
});
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment