AdapTable React Vitest Example Setup

This is a very basic example of a setup with Vite & Vitest.

See the AdapTable React Support Template for a full example of AdapTable React.

AdapTable React is the React Framework version of AdapTable - the market-leading, low-code AG Grid extension from AdapTable Tools.

For full information on how to use AdapTable React see the AdapTable Documentation.

Versions and Dependencies

The demo is built using these key packages:

• AdapTable version 20
• AG Grid version 33.x
• React version 18

Contents

This template contains just the bare bones required to set up an AdapTable instance with Vitest.

There are 3 important issues we fixed in this template:

• vitest requires ESM imports to include the file extension, so we had to install the extensionless node module loader, since Adaptable (and probably most of your other dependencies) does not include the file extension in its internal imports. See the test script in package.json.
• vitest does not correctly read the module field in the package.json of Adaptable, so we had to use patch-package to fix this issue and patch @adaptabletools/adaptable-react-aggrid with the following lines in package.json

+ "exports": {
+   ".": "./src/index.js"
+ }

• vitest requires certain dependencies to be inlined during testing. We configure this using the server.deps.inline option to handle AdapTable's imports correctly. See Vitest Server Dependencies Configuration for more details:

server: {
  deps: {
    inline: [/@adaptabletools\/adaptable/],
  }
}

Using patch-package

This project uses patch-package to modify the @adaptabletools/adaptable-react-aggrid package to work correctly with Vitest.

To make changes to a package:

1. Make the required changes in node_modules/@adaptabletools/adaptable-react-aggrid/package.json
2. Run npx patch-package @adaptabletools/adaptable-react-aggrid to create a patch file
3. The patch will be saved in the patches directory

The patches are automatically applied after npm install through the postinstall script in package.json.

Installation

Run npm install (or yarn), depending on what tool you're using.

Running for development

Execute the following command

$ npm run start

Running the tests

Execute the following command

$ npm run test

See App.test.tsx for an example test.

Licences

An AdapTable Licence provides access to all product features as well as quarterly updates and enhancements through the lifetime of the licence, comprehensive support, and access to all 3rd party libraries.

Licences can be purchased individually, for a team, for an organisation or for integration into software for onward sale.

We can make a Trial Licence available for a short period of time to allow you to try out AdapTable for yourself.

Please contact [email protected] for more information.

Help

Developers can learn how to access AdapTable programmatically at AdapTable Documentation.

Here you can see a large number of AdapTable demos each showing a different feature, function or option in AdapTable.

Demo

To see AdapTable in action visit our Demo Site which contains a few larger demos.

More Information

General information about Adaptable Tools is available at our Website.

Support

For all support enquiries please raise a Support Ticket.