Extension methods for MockBuilder

[satanTime]

Discussed in #5404

^{Originally posted by AE1NS April 6, 2023}
I would love to write some reusable extension methods for the MockBuilder. But as MockBuilder is a function and not a class, I'm struggling a bit how to achieve this.
Thought I could use something like this:
.d.ts:

export {};

declare module 'ng-mocks' {
    interface IMockBuilder {
        mockCustom(): IMockBuilder;
    }
}

.ts:

MockBuilder.prototype.mockCustom = function(): IMockBuilder {
    // some custom stuff on the MockBuilder
    return this;
};

test.spec.ts:

beforeEach(() =>
    MockBuilder(TestComponent)
        .mockCustom()
);

The type is recognized correctly but it will not run, as 'MockBuilder.prototype' cant work on a function. Can you tell me if can extend it on another way externally?

[AE1NS]

There are at least this two options to achieve it:

• Refactor MockBuilder to a class. But then it wouldnt be possible to use it statically, so it must be called with 'new MockBuilder(' or with a static method, something like 'MockBuilder.create(', that creates the instance then.
• Create another base class between, i.e. MockBuilder returns a MockBuilderBase (or whatever), class MockBuilderBase extends MockBuilderPerformance, ... and MockBuilderBase must be exported to be accessible by the users. Alternatively just export MockBuilderPerformance, but the name is maybe a bit confusing for others.

What do you think?

At the moment I solved it with a workaround:

export function CustomMockBuilder(...args: Array<MockBuilderParam | MockBuilderParam[] | null | undefined>): IMockBuilder {
    const instance = MockBuilder(...args) as any;

    Object.assign(instance, {
        mockCustom: function (overrides?: Partial<CapacitorGlobal>): IMockBuilder {
            this.mock(...);
            return this;
        },
    });

    return instance;
}

And then Im using the CustomMockBuilder instead of the MockBuilder. But I would prefer a solution with extension methods when it would be possible :P

[satanTime]

THank you for the info. That makes sense. I'll add its support during next weeks.

[AE1NS]

Do you have updates on this?

[satanTime]

Hi @AE1NS,

happy Sunday!

Would something like that work for you?

declare module 'ng-mocks' {
  interface IMockBuilder {
    customMock(value: string): this;
  }
}

MockBuilder.extend('customMock', (builder, [value]: Parameters<IMockBuilder['customMock']>) => {
  // here can be any custom logic around `builder`.
  builder.mock(TargetService, {
    echo: () => value,
  });
});

[satanTime]

Docs are here: https://ng-mocks.sudo.eu/api/MockBuilder#extending-mockbuilder

[AE1NS]

Wow looks great! Thank you!

Btw: Little typo in the documentation inside the example code comment: the extention to MockBuilder <- extension

[satanTime]

Hi there.

If you mean Extension - that's expected. I needed to add a new interface to pass type checks.

Please, let me know how it works for you.

[AE1NS]

Just tested it, works like expected!

I am talking about the typo in the comment .customMock('value') // <-- the extention to MockBuilder
where 'extention' should be 'extension'

[satanTime]

Ah. I see. Thank you for spotting that. Could you submit a PR? You can edit the page right on GitHub.

[AE1NS]

#6005

[satanTime]

Thank you! I'm going to deploy it later today.