AI + TDD
Follow the bird 
GPT4 powered CLI for TDD
You write the test, GPT writes the code to pass it ✅
Prompting GPT with a test suite makes it write code impressively accurate
Example
Here is a frontend test suite written in Jest + Testing Library. Yes, AI-TDD easily passes frontend tests:
import React from 'react';
import { rest } from 'msw';
import { setupServer } from 'msw/node';
import { render, fireEvent, waitFor, screen } from '@testing-library/react';
import '@testing-library/jest-dom';
import Fetch from '../fetch';
const server = setupServer(
rest.get('/greeting', (req, res, ctx) => {
return res(ctx.json({ greeting: 'hello there' }));
})
);
beforeAll(() => server.listen());
afterEach(() => server.resetHandlers());
afterAll(() => server.close());
test('loads and displays greeting', async () => {
render(<Fetch url="/greeting" />);
fireEvent.click(screen.getByText('Load Greeting'));
await waitFor(() => screen.getByRole('heading'));
expect(screen.getByRole('heading')).toHaveTextContent('hello there');
expect(screen.getByRole('button')).toBeDisabled();
});
test('handles server error', async () => {
server.use(
rest.get('/greeting', (req, res, ctx) => {
return res(ctx.status(500));
})
);
render(<Fetch url="/greeting" />);
fireEvent.click(screen.getByText('Load Greeting'));
await waitFor(() => screen.getByRole('alert'));
expect(screen.getByRole('alert')).toHaveTextContent('Oops, failed to fetch!');
expect(screen.getByRole('button')).not.toBeDisabled();
});Ready? Here is the code generated by AI-TDD (GPT-4) to pass the test:
import React, { useState } from 'react';
function Fetch({ url }) {
const [data, setData] = useState(null);
const [error, setError] = useState(null);
const [loading, setLoading] = useState(false);
async function fetchData() {
setLoading(true);
try {
const response = await fetch(url);
if (!response.ok) throw new Error('Failed to fetch');
const data = await response.json();
setData(data.greeting);
} catch (error) {
setError(error.message);
} finally {
setLoading(false);
}
}
return (
<div>
{data && <h1 role="heading">{data}</h1>}
{error && <div role="alert">{error}</div>}
<button onClick={fetchData} disabled={loading}>
Load Greeting
</button>
</div>
);
}
export default Fetch;Setup
-
Install AI-TDD globally to use in any repository:
npm install -g ai-tdd
-
Get your API key from OpenAI. Make sure you add payment details, so API works.
-
Set the key to AI-TDD config:
aitdd config set OPENAI_API_KEY=<your_api_key>
Your api key is stored locally in
~/.ai-tddconfig file and is not stored anywhere in any other way.
Usage
You can call AI-TDD like this:
aitdd <test suite filepath...>You can also call it via ait or tdd shortcuts:
ait <test suite filepath...>Or:
tdd <test suite filepath...>Payments
You pay for your own requests to OpenAI API. AI-TDD uses GPT-4 model by default, check it's pricing. Maximum response tokens are set to 2000, you can adjust it via ait config set maxTokens=<number>.
I couldn't manage ChatGPT model to solve the problem. I tried to few shot it with a response example, it doesn't understand what I want. If you want to try manage it via ChatGPT — test it and open a PR 🚀