Found non-null assertions JS-0339
Anti-pattern
Major
2 years ago
—
2 years old
Forbidden non-null assertion
23 }
24
25 getURLForProject(project: IProject): string {
26 return `${location.origin}/project/${project.id!}/view`;27 }
28
29 onChangeURL(url: SafeUrl): void {Forbidden non-null assertion
69 cy.get(entityCreateSaveButtonSelector).should('exist');
70 cy.get(entityCreateCancelButtonSelector).click();
71 cy.wait('@entitiesRequest').then(({ response }) => {
72 expect(response!.statusCode).to.equal(200); 73 });
74 cy.url().should('match', topicPageUrlPattern);
75 });Forbidden non-null assertion
45 cy.visit('/');
46 cy.clickOnEntityMenuItem('topic');
47 cy.wait('@entitiesRequest').then(({ response }) => {
48 if (response!.body.length === 0) { 49 cy.get(entityTableSelector).should('not.exist');
50 } else {
51 cy.get(entityTableSelector).should('exist');Forbidden non-null assertion
159 topic = response!.body;
160 });
161 cy.wait('@entitiesRequest').then(({ response }) => {
162 expect(response!.statusCode).to.equal(200);163 });
164 cy.url().should('match', topicPageUrlPattern);
165 });Forbidden non-null assertion
156
157 cy.wait('@postEntityRequest').then(({ response }) => {
158 expect(response!.statusCode).to.equal(201);
159 topic = response!.body;160 });
161 cy.wait('@entitiesRequest').then(({ response }) => {
162 expect(response!.statusCode).to.equal(200);
Description
Using non-null assertions cancels out the benefits of strict null-checking, and introduces the possibility of runtime errors. Avoid non-null assertions unless absolutely necessary. If you still need to use one, write a skipcq comment to explain why it is safe.
Ideally, you want to have a validation function that confirms a value isn't null, with a return type like this:
type AccentedColor = `${Color}-${Accent}`
function isColorValid(name: string): name is AccentedColor {
// ...
}
Bad Practice
// a user named "injuly" may not exist in the DB
const injuly: User | null = db.getUserByName("injuly");
// Using the non-null assertion operator will bypass null-checking
const pfp = injuly!.profilePicture;
Recommended
const injuly: User | null = db.getUserByName("injuly");
const pfp = injuly?.profilePicture; // pfp: Image | undefined
// OR:
const pfp_ = injuly ? injuly.pfp : defaultPfp; // pfp: Image
Alternatively:
function isUserValid(userObj: User | null | undefined ): userObj is User {
return Boolean(userObj) && validate(userObj);
}
const injuly = db.getUserByName("injuly")
if (isUserValid(injuly)) {
const pfp = injuly.profilePicture;
// ...
}