Sabbir Ahmed
Sabbir Ahmed

Reputation: 1704

StatusBar does not have web implementation

I'm trying to render a component using react-testing-library in an Ionic React based project. There appears to be an issue with StatusBar. The error says StatusBar does not have web implementation.

My code looks something like this:

let component

beforeEach(() => {
    component = render(
        <ThemeProvider>
                <IonReactRouter>
                    <IonRouterOutlet>
                        <Login />
                    </IonRouterOutlet>
                </IonReactRouter>
        </ThemeProvider>
    )
})

describe('snapshot', () => {
    it('should match snapshot', () => {
        const { asFragment } = component
        expect(asFragment()).toMatchSnapshot()
    })
})

Upvotes: 2

Views: 4086

Answers (3)

Rapha&#235;l Balet
Rapha&#235;l Balet

Reputation: 8491

You could check if the app is running on the native platform or not

import { Capacitor } from '@capacitor/core'
import { StatusBar, Style } from '@capacitor/status-bar'


if (Capacitor.isNativePlatform()) {
  StatusBar.setBackgroundColor({ color: '#ffffff' })
  StatusBar.setStyle({ style: Style.Light })
}

Upvotes: 0

Yaasiin Ayeva
Yaasiin Ayeva

Reputation: 23

Have you installed @capacitor/status-bar in /src-capacitor? (yarn add @capacitor/status-bar or npm install ....)

Upvotes: 0

Mark
Mark

Reputation: 495

That's no error, that's the Capacitor Plugin not having the Web Implementation, you could just ignore that or catch it everywhere with .catch(()=>{});

Upvotes: 4

Related Questions