Skip to content

Commit

Permalink
refactor(serializers): use proper ts types for ng-snapshot
Browse files Browse the repository at this point in the history
  • Loading branch information
ahnpnl committed Jul 22, 2024
1 parent 17605f4 commit 3ce21cd
Showing 1 changed file with 7 additions and 46 deletions.
53 changes: 7 additions & 46 deletions src/serializers/ng-snapshot.ts
Original file line number Diff line number Diff line change
@@ -1,50 +1,13 @@
import type { ComponentRef, Type, ɵCssSelectorList } from '@angular/core';
import type { ɵComponentType, ɵDirectiveDef } from '@angular/core';
import type { ComponentFixture } from '@angular/core/testing';
import type { Colors } from 'pretty-format';

/**
* The follow interfaces are customized heavily inspired by @angular/core/core.d.ts
*/
interface ComponentDef {
selectors: ɵCssSelectorList;
}
interface IvyComponentType extends Type<unknown> {
ɵcmp: ComponentDef;
}
interface NgComponentRef extends ComponentRef<unknown> {
componentType: IvyComponentType;
_elDef: any; // eslint-disable-line @typescript-eslint/no-explicit-any
_view: any; // eslint-disable-line @typescript-eslint/no-explicit-any
}
interface NgComponentFixture extends ComponentFixture<unknown> {
componentRef: NgComponentRef;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
componentInstance: Record<string, any>;
}

/**
* The following types haven't been exported by jest so temporarily we copy typings from 'pretty-format'
*/
interface PluginOptions {
edgeSpacing: string;
min: boolean;
spacing: string;
}
type Indent = (indentSpaces: string) => string;
type Printer = (elementToSerialize: unknown) => string;
import type { OldPlugin } from 'pretty-format';

const attributesToRemovePatterns = ['__ngContext__'];

const print = (
fixture: NgComponentFixture,
printer: Printer,
indent: Indent,
opts: PluginOptions,
colors: Colors,
): string => {
const print: OldPlugin['print'] = (fixture, printer, indent, opts, colors) => {
let componentAttrs = '';
const { componentRef, componentInstance } = fixture;
const componentDef = componentRef.componentType.ɵcmp;
const { componentRef, componentInstance } = fixture as ComponentFixture<Record<string, unknown>>;
const componentDef = (componentRef.componentType as ɵComponentType<unknown>).ɵcmp as ɵDirectiveDef<unknown>;
const componentName = componentDef.selectors[0][0] as string;
const nodes = Array.from(componentRef.location.nativeElement.childNodes).map(printer).join('');
const attributes = Object.keys(componentInstance).filter((key) => !attributesToRemovePatterns.includes(key));
Expand Down Expand Up @@ -80,11 +43,9 @@ const print = (
).replace(/\n^\s*\n/gm, '\n');
};

// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
const test = (val: any): boolean =>
!!val && typeof val === 'object' && Object.prototype.hasOwnProperty.call(val, 'componentRef');
const test: OldPlugin['test'] = (val) => !!val && typeof val === 'object' && 'componentRef' in val;

export = {
print,
test,
};
} as OldPlugin;

0 comments on commit 3ce21cd

Please sign in to comment.