Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

FontAwesome: Could not find icon with iconName=plus and prefix=fas. This warning will become a hard error in 0.6.0.

See original GitHub issue

I use FontAwesome into my application, that in constructor import a library:

export class CoreModule {
    constructor(library: FaIconLibrary) {
        library.addIconPacks(fas);
    }
}

when i do test with angular testing library

import {render} from '@testing-library/angular';
import {screen} from '@testing-library/dom';
import {DialogWrapperComponent} from './dialog-wrapper.component';
import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
import {FaIconLibrary, FontAwesomeModule} from '@fortawesome/angular-fontawesome';
import {fas} from '@fortawesome/free-solid-svg-icons';
import {SharedModule} from '../shared.module';
import {CoreModule} from '../../core/core.module';
import {NO_ERRORS_SCHEMA} from '@angular/core';
import {TestBed} from '@angular/core/testing';

describe('first test', () => {

    test('first input test', async () => {
        TestBed.configureTestingModule({
            schemas: [NO_ERRORS_SCHEMA],
            imports: [FontAwesomeModule],
        }).compileComponents();

        const close = jest.fn();
        const {click} = await render(DialogWrapperComponent, {
            declarations: [],
            imports: [
                FontAwesomeModule,
            ],
            providers: [
                NgbModal,
            ],
            componentProperties: {
                title: 'hello',
               --> iconColorPair: {icon: 'plus', color: 'black'},
                modalClose: {
                    emit: close,
                } as any
            },
        });
        const title = screen.getByText('hello');
        const iconClose = screen.getByTestId('btn-close');
        --> const icon = screen.getByText('fas, file');
        click(iconClose);
        expect(close).toHaveBeenCalledTimes(1);
    });
});

the test write this message FontAwesome: Could not find icon with iconName=plus and prefix=fas. This warning will become a hard error in 0.6.0.

Someone can help me? please

Issue Analytics

State:
Created 3 years ago
Comments:5 (2 by maintainers)

Top GitHub Comments

2reactions

georgy-alarconcommented, Mar 31, 2020

ok i resolve!! i create a new module only for the icon a then import this into my render method

import { NgModule } from '@angular/core';
import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
import {fas} from '@fortawesome/free-solid-svg-icons';

@NgModule({
    imports: [ FontAwesomeModule ],
    exports: [ FontAwesomeModule ],
    bootstrap: [],
})
export class IconsModule {
    constructor(library: FaIconLibrary) {
        library.addIconPacks(fas);
    }
}

const {click} = await render(DialogWrapperComponent, {
            declarations: [
            ],
            imports: [
                FontAwesomeModule,
                --> IconsModule
            ],
            providers: [
                NgbModal,
            ],
            componentProperties: {
                title: 'hello',
                iconColorPair: {icon: 'plus', color: 'black'},
                modalClose: {
                    emit: close,
                } as any
            },
        });

0reactions

sanchitoscommented, Oct 15, 2021

@georgy-alarcon Thank you!