How to test PNP using JEST?

Question

Is there any way to mock the context of the webpart since i need it to be able to make a request through pnp ?

Answer 1

You can import two typescript classes from SPFx, Enviroment and EnviromentType:

import { Environment, EnvironmentType } from "@microsoft/sp-core-library";

so you can identify the enviroment:

if (Environment.type == EnvironmentType.SharePoint || 
    Environment.type == EnvironmentType.ClassicSharePoint) {
    // use sp context and pnp calls...
} else {
    // mock data...
}

Then you should define two classes that implement the same interface, one class with pnp calls and the other with functions that return mock data.

Jest has built-in support for mocks, but Sinon.js could be a better option.