Files
iNaturalistReactNative/tests/unit/components/ObsEdit/IdentificationSection.test.js
Johannes Klein a20a22bad8 Hide "id with ai button" for no media or sound only (#2896)
* Add Boolean to control button being shown

Same Button component, only with changed indentation

* Apply margin between buttons to hide button instead

* Move left margin to container

Because ID button is now optional but container is not.

* Increase margin between buttons

Not part of the ticket, but it was not according to designs.

* Use existing state for the button

* Update integration test

* Update duplicate testID

* Add unit test for showing button behaviour based on photos
2025-05-16 15:30:06 +02:00

64 lines
2.1 KiB
JavaScript

import { screen } from "@testing-library/react-native";
import IdentificationSection from "components/ObsEdit/IdentificationSection";
import React from "react";
import factory from "tests/factory";
import { renderComponent } from "tests/helpers/render";
const observationWithPhotos = factory( "RemoteObservation", {
observationPhotos: [{ id: 1 }]
} );
const observationWithoutPhotos = factory( "RemoteObservation", {
observationPhotos: []
} );
const firstObservation = factory( "RemoteObservation", {
taxon: {
name: "Fungi",
isIconic: true,
iconic_taxon_name: "Fungi",
id: 47170
}
} );
const secondObservation = factory( "RemoteObservation", {
taxon: {
name: "Aves",
isIconic: true,
iconic_taxon_name: "Aves",
id: 3
}
} );
const mockObservations = [firstObservation, secondObservation];
const renderIdentificationSection = ( obs, index = 0, resetState = false ) => renderComponent(
<IdentificationSection
currentObservation={obs[index]}
observations={obs}
resetState={resetState}
/>
);
describe( "IdentificationSection", () => {
it( "should show ID WITH AI button when observation has photos", ( ) => {
renderIdentificationSection( [observationWithPhotos] );
expect( screen.getByText( "ID WITH AI" ) ).toBeTruthy();
} );
it( "should not show ID WITH AI button when observation has no photos", ( ) => {
renderIdentificationSection( [observationWithoutPhotos] );
expect( screen.queryByText( "ID WITH AI" ) ).toBeNull();
} );
it( "should show correct iconic taxon selection when navigating multiple observations", ( ) => {
renderIdentificationSection( mockObservations );
const fungiIcon = screen.getByTestId( "IconicTaxonButton.fungi" );
expect( fungiIcon ).toHaveProp( "accessibilityState", { selected: true } );
renderIdentificationSection( mockObservations, 1, true );
const icon = screen.getByTestId( "IconicTaxonButton.fungi" );
expect( icon ).toHaveProp( "accessibilityState", { selected: false } );
const birdIcon = screen.getByTestId( "IconicTaxonButton.aves" );
expect( birdIcon ).toHaveProp( "accessibilityState", { selected: true } );
} );
} );