我有一个具有以下结构的angular库
projects/
|..... app/
|..... src/
|..... app/
|..... app.component.spec.ts
|..... app.component.ts
|..... app.module.ts
|..... lib/
|..... sso/
|...... index.ts
|...... ng-package.json
|...... ...
|...... sso.service.ts
|...... ss.module.ts
|..... ui/
|...... menu/
|...... menu.component.ts
|...... menu.service.ts
|...... menu.module.ts
|...... index.ts
|...... ng-package.json
|..... ng-package.json
|..... package.json
|..... jest.config.ts
|..... package.json
字符串
我想测试我的app.component
// app.component.ts
import {SSOService} from "my-lib/sso";
@Component({
selector: 'app-root',
template: `
<my-menu>
<router-outlet></router-outlet>
</my-menu>
`,
styleUrls: ['./app.component.scss'],
})
export class AppComponent {
constructor(protected ssoService: SSOService) { }
}
型
这里是我目前的测试
// app.component.spec.ts
import { TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';
import {SSOService} from "my-lib/sso";
import {MenuComponent} from "my-lib/ui";
describe('AppComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [
RouterTestingModule
],
declarations: [
AppComponent, MenuComponent
],
providers: [
{
provide: SSOService,
useValue: {
setRoles: jest.fn()
}
}
]
}).compileComponents();
});
it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app).toBeTruthy();
});
});
型
我不得不模仿我的sso_service,即使它在同一个项目中!但仍然有同样的问题与MenuComponent
● Test suite failed to run
TypeError: Cannot read properties of undefined (reading 'toLowerCase')
289 | }] });
290 |
> 291 | registerLocaleData(FR);
| ^
292 | /**
293 | * Custom date adapter for Angular Material.
294 | *
at registerLocaleData (node_modules/@angular/core/fesm2022/core.mjs:22410:25)
at registerLocaleData (node_modules/@angular/common/fesm2022/common.mjs:2562:12)
at Object.<anonymous> (dist/lib/fesm2022/my-lib-ui.mjs:291:1)
at Object.<anonymous> (projects/app/src/app/app.component.spec.ts:5:1)
型
我也不想嘲笑这个组件,可能是库或Jest Config有问题吗?
PS:在迁移到jest
之前,测试在karma
上运行良好
请在下面找到不同的配置文件
// lib/ui/index.ts
import { CommonMenuService } from './menu/menu.service';
export * from './menu/menu.component';
export * from './menu/menu.module';
export * from './menu/menu.service';
// lib/ui/ng-package.json
{
"lib": {
"entryFile": "index.ts"
}
}
// lib/ui/pacakge.json
{
"name": "my-lib",
"version": "2.5.2",
"peerDependencies": {
"@angular/cdk": "^17.0.0",
"@angular/common": "^17.0.1",
"@angular/core": "^17.0.1",
"@angular/material": "^17.0.0",
"@awesome-cordova-plugins/in-app-browser": "^6.3.0",
"@capacitor/device": "^5.0.6",
"angular-oauth2-oidc": "^15.0.1",
"jwt-decode": "^4.0.0"
},
"dependencies": {
"tslib": "^2.6.2"
},
"sideEffects": false,
"exports": {
".": {
"sass": "./styles/_index.scss"
}
}
}
的字符串
这是我的Jest.config
// jest.config.ts
import type { Config } from 'jest';
const config: Config = {
clearMocks: true,
collectCoverage: true,
coverageDirectory: 'coverage',
coverageProvider: 'v8',
preset: 'jest-preset-angular',
setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
};
export default config;
型
我的tslog.json看起来像这样
// tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"paths": {
"my-lib/*": ["projects/lib/*"],
"my-lib": ["projects/lib"]
},
"noFallthroughCasesInSwitch": true,
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "ES2022",
"module": "ES2022",
"useDefineForClassFields": false,
"lib": ["ES2022", "dom"]
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}
型
1条答案
按热度按时间brgchamk1#
我想我已经找到了我的问题的答案!它似乎比写问题本身更快^^“
答案就在这篇文章https://fireflysemantics.medium.com/unit-testing-your-angular-library-project-with-jest-42429a8716eb中
在我的tslog.json我有
字符串
因此,我必须在jest配置中添加以下内容
型
耶!它现在起作用了