Also stub the test file as well? about agrippa HOT 6 CLOSED

Hi! thanks for reaching out.

Yes, auto-generating test files could be very nice.
I'll try to research it in some when I have some time. Of course, if you have any ideas, suggestion or leads, please share them!

from agrippa.

@nitzanhen The project I linked to creates a file that follows this template:

MapLegend.test.tsx

import React from 'react';
import { render, screen } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
import MapLegend from './MapLegend';

describe('<MapLegend />', () => {
  test('it should mount', () => {
    render(<MapLegend />);
    
    const mapLegend = screen.getByTestId('MapLegend');

    expect(mapLegend).toBeInTheDocument();
  });
});

When you generated a component named "MapLegend"-

from agrippa.

In the meantime, you can create test files using a post-command. This requires using a beta version, which you can install using npm i -g agrippa@next. If you run into any issues with it, please reply!

For example, create a file (e.g. gentest.sh) with the following content:

#!/bin/bash

COMPONENT_NAME=$1
COMPONENT_DIR=$2

DATA="
import React from 'react';
import ReactDOM from 'react-dom';
import { $COMPONENT_NAME } from './$COMPONENT_NAME';

it('It should mount', () => {
  const div = document.createElement('div');
  ReactDOM.render(<$COMPONENT_NAME />, div);
  ReactDOM.unmountComponentAtNode(div);
});
"

TEST_FILE_PATH="$COMPONENT_DIR/$COMPONENT_NAME.test.jsx"

echo "$DATA" > $TEST_FILE_PATH

Then, in .agripparc.json, add

{
  //...
  "postCommand": "<path_to_dir>/gentest.sh  <ComponentName> <dirPath>" 
}

Note: I am by no means proficient in bash scripting. This script can probably be improved, but it's simple to understand and seems to work decently.
Also, <ComponentName> is added in v1.4.0-alpha.1, which is why you need the beta version. You could get it to work without <ComponentName>, i.e. on the stable version, as you can see in the issue linked below.

You can also pass --post-command: "<path_to_dir>/gentest.sh <ComponentName> <dirPath> through the command line, though I'd recommend using a config for convenience.

For more info, see Post Command cookbook 🍲 the discussion on issue #42.

from agrippa.

@nitzanhen The project I linked to creates a file that follows this template:

MapLegend.test.tsx

import React from 'react';
import { render, screen } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
import MapLegend from './MapLegend';

describe('<MapLegend />', () => {
  test('it should mount', () => {
    render(<MapLegend />);
    
    const mapLegend = screen.getByTestId('MapLegend');

    expect(mapLegend).toBeInTheDocument();
  });
});

When you generated a component named "MapLegend"-

Yes, they seemed to have done pretty well there (with support for multiple testing frameworks and fairly reasonable templates). I'll use it as a reference, thanks!

from agrippa.

I'd love to see this as well. I've been using hygen.io for a while, but have grown to like agrippa a lot. I really like using a config file to dictate good options, rather than re-inventing an entire template library to do codegen.

from agrippa.

Hi! Sorry for the delay. I've not forgotten about this issue.
I'm working on a big new version for Agrippa - one that will solve the current scalability issues and make Agrippa much more modular and customizable.

As soon as that's done - generating test files are at the top of my list. I'm making great progress on the new version, and will hopefully be able to get to it pretty soon.

In the meantime, we can already start planning - which testing frameworks are you using? what would a basic test-file template look like? I am by no means an expert on testing front-end components, so your input could be of great help.

Again, sorry for the delay.

from agrippa.