-
|
Hi everyone, My point is to mock/spy specific npm packages such like // event-source-client.ts
import { inject, Injectable } from '@angular/core';
import { AuthService as Auth0 } from '@auth0/auth0-angular';
import { EventSource } from 'eventsource';
import { firstValueFrom } from 'rxjs';
@Injectable({
providedIn: 'root',
})
export class EventSourceClient {
private readonly auth0 = inject(Auth0);
connect(url: string, options?: RequestInit): EventSource {
return new EventSource(url, {
fetch: async (input, init) => {
const token = await this.getAccessToken();
if (token) {
init.headers['Authorization'] = `Bearer ${token}`;
}
return fetch(input, {
...init,
...options,
headers: {
...init.headers,
...options?.headers,
},
});
},
});
}
private async getAccessToken(): Promise<string> {
return firstValueFrom(this.auth0.getAccessTokenSilently());
}
}
// event-source-client.spec.ts
import { TestBed } from '@angular/core/testing';
import { AuthService as Auth0 } from '@auth0/auth0-angular';
import { EventSource } from 'eventsource';
import { of } from 'rxjs';
import { EventSourceClient } from './event-source-client';
vi.stubGlobal('fetch', vi.fn().mockResolvedValue(new Response()));
vi.mock('eventsource', () => ({
EventSource: vi.fn(
class {
readonly withCredentials: boolean;
constructor(
public readonly url: string | URL,
eventSourceInitDict?: EventSourceInit,
) {
this.withCredentials = eventSourceInitDict?.withCredentials || false;
console.log('Mocked!') // <-- never called
}
},
),
}));
describe('EventSourceClient', () => {
let client: EventSourceClient;
beforeEach(() => {
TestBed.configureTestingModule({
providers: [
{
provide: Auth0,
useValue: {
getAccessTokenSilently: vi.fn().mockReturnValue(of('token')),
},
},
],
});
client = TestBed.inject(EventSourceClient);
});
it('should instantiate the service', () => {
expect(client).toBeTruthy();
});
it('should establish an event source connection with authorization header', async () => {
const eventSource = client.connect('http://api.foo.com/sse');
const options = vi.mocked(EventSource).mock.lastCall?.[1];
expect(eventSource.url).toBe('http://api.foo.com/sse');
expect(options?.fetch).toBeDefined();
await options?.fetch?.('http://api.foo.com/sse', {
cache: 'no-store',
headers: { Accept: 'text/event-stream' },
mode: 'no-cors',
redirect: 'manual',
signal: null,
});
expect(fetch).toHaveBeenCalledWith('http://api.foo.com/sse', {
headers: expect.objectContaining({
Accept: 'text/event-stream',
Authorization: 'Bearer token',
}),
cache: 'no-store',
mode: 'no-cors',
redirect: 'manual',
signal: null,
});
});
});I'm using Node v24.11.1 both on my local environement and on CI. Here is my default:
image: node:24
cache:
key:
files:
- package-lock.json
paths:
- .npm/
before_script:
- npm ci --cache .npm --prefer-offline
lint:
stage: test
tags:
- gitlab-org
script:
- npm run lint
rules:
- if: $CI_PIPELINE_SOURCE == 'merge_request_event'
test:
stage: test
tags:
- gitlab-org
variables:
CI: true
script:
- npm run test
rules:
- if: $CI_PIPELINE_SOURCE == 'merge_request_event'I already tried tu I'm wondering if is it related to angular v21, gitlab or vitest itself. Does anyone has a clue on this issue ? Thanks in advance. What I get from Gitlab : |
Beta Was this translation helpful? Give feedback.
Replies: 3 comments
-
|
I have something similar but in GitHub Actions. If I run my test with with It used to work, not exactly sure prior to which version, but before 4.0.6. import { twMerge } from 'tailwind-merge'
import { twm } from './twm.ts'
vi.mock(import('tailwind-merge'), async importOriginal => {
const originalModule = await importOriginal()
return { ...originalModule, twMerge: vi.fn() }
})
afterEach(() => {
vi.clearAllMocks()
})
test('twm should not run tailwind-merge for bottom values', async () => {
twm(undefined, null, 0, 0n, false)
expect(twMerge).not.toHaveBeenCalled()
})
test('twm should not run tailwind-merge if only one class', async () => {
twm('foo')
expect(twMerge).not.toHaveBeenCalled()
})
test('twm should run tailwind-merge if more than one class', async () => {
twm('foo', 'bar')
expect(twMerge).toHaveBeenCalled()
}) |
Beta Was this translation helpful? Give feedback.
-
|
If I use a setup file and move the mock into it, everything pass (local and CI). But it's really annoying to have to it so. Sounds like a bug to me but am I the only one to encounter this behavior ? Because of it , I can't release my angular migration. I don’t understand why there is a difference between the CI and my local machine, especially when using CI=true. |
Beta Was this translation helpful? Give feedback.
-
|
Ugh, finally figured out why my Vitest tests were flaky in GitLab CI! Turns out the default runner was stuck on a single core, and Vitest’s parallel tests were just choking on it—mocks would randomly fail, and everything was a mess. Switched to the gitlab-org-medium runner with more cores, and boom, tests are stable again. |
Beta Was this translation helpful? Give feedback.
Ugh, finally figured out why my Vitest tests were flaky in GitLab CI! Turns out the default runner was stuck on a single core, and Vitest’s parallel tests were just choking on it—mocks would randomly fail, and everything was a mess. Switched to the gitlab-org-medium runner with more cores, and boom, tests are stable again.