<commit_before>/**
 * SettingsActiveModule Header component tests.
 *
 * Site Kit by Google, Copyright 2022 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     https://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/**
 * External dependencies
 */
import { createHashHistory } from 'history';
import { Switch, Route } from 'react-router-dom';

/**
 * WordPress dependencies
 */
import { ENTER, ESCAPE } from '@wordpress/keycodes';

/**
 * Internal dependencies
 */
import Header from '.';
import {
	render,
	createTestRegistry,
	provideModules,
	fireEvent,
} from '../../../../../tests/js/test-utils';

describe( 'Header', () => {
	const history = createHashHistory();
	let registry;

	const HeaderAwareRouter = () => {
		return (
			<Switch>
				<Route
					path={ [
						'/connected-services/:moduleSlug',
						'/connected-services',
					] }
				>
					<Header slug="pagespeed-insights" />,
				</Route>
			</Switch>
		);
	};

	beforeEach( () => {
		global.location.hash = '';
		registry = createTestRegistry();

		provideModules( registry, [
			{
				slug: 'analytics',
				active: true,
				connected: true,
			},
			{
				slug: 'pagespeed-insights',
				active: true,
				connected: true,
			},
			{
				slug: 'tagmanager',
				active: true,
				// Intentionally not connected here with both settings components for tests below.
				connected: false,
			},
			{
				slug: 'analytics-4',
				active: true,
				// Intentionally not connected here with both settings components for tests below.
				connected: false,
			},
		] );
	} );

	it( 'should render "Connected" for a connected module', () => {
		const { container } = render( <Header slug="pagespeed-insights" />, {
			registry,
		} );

		expect( container ).toHaveTextContent( 'Connected' );
	} );

	it( 'should render a button to complete setup for a non-connected module', () => {
		const { queryByRole } = render( <Header slug="tagmanager" />, {
			registry,
		} );

		const button = queryByRole( 'button' );
		expect( button ).toBeInTheDocument();
		expect( button ).toHaveTextContent( 'Complete setup for Tag Manager' );
	} );

	it( 'should render a button to connect GA4 if Analytics is connected but GA4 is not', () => {
		const { queryByRole } = render( <Header slug="analytics" />, {
			registry,
		} );

		const button = queryByRole( 'button' );
		expect( button ).toBeInTheDocument();
		expect( button ).toHaveTextContent( 'Connect Google Analytics 4' );
	} );

	it( 'should open the tab when ENTER key is pressed', () => {
		history.push( '/connected-services' );

		const { container } = render( <HeaderAwareRouter />, {
			registry,
			history,
		} );

		const headerElement = container.querySelector(
			'.googlesitekit-settings-module__header'
		);

		fireEvent.keyDown( headerElement, { keyCode: ENTER } );
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( true );
	} );

	it( 'should close the tab if opened when ENTER key is pressed', () => {
		history.push( '/connected-services/pagespeed-insights' );

		const { container } = render( <HeaderAwareRouter />, {
			registry,
			history,
		} );

		const headerElement = container.querySelector(
			'.googlesitekit-settings-module__header'
		);

		fireEvent.keyDown( headerElement, { keyCode: ENTER } );
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( false );
	} );

	it( 'should close the tab if opened when ESCAPE key is pressed', () => {
		history.push( '/connected-services/pagespeed-insights' );

		const { container } = render( <HeaderAwareRouter />, {
			registry,
			history,
		} );

		const headerElement = container.querySelector(
			'.googlesitekit-settings-module__header'
		);

		fireEvent.keyDown( headerElement, { keyCode: ESCAPE } );
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( false );
	} );
} );<commit_msg>Add a test case to ensure the tab does not toggle for other key press.<commit_after>/**
 * SettingsActiveModule Header component tests.
 *
 * Site Kit by Google, Copyright 2022 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     https://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/**
 * External dependencies
 */
import { createHashHistory } from 'history';
import { Switch, Route } from 'react-router-dom';

/**
 * WordPress dependencies
 */
import { DOWN, ENTER, ESCAPE, UP } from '@wordpress/keycodes';

/**
 * Internal dependencies
 */
import Header from '.';
import {
	render,
	createTestRegistry,
	provideModules,
	fireEvent,
} from '../../../../../tests/js/test-utils';

describe( 'Header', () => {
	const history = createHashHistory();
	let registry;

	const HeaderAwareRouter = () => {
		return (
			<Switch>
				<Route
					path={ [
						'/connected-services/:moduleSlug',
						'/connected-services',
					] }
				>
					<Header slug="pagespeed-insights" />,
				</Route>
			</Switch>
		);
	};

	beforeEach( () => {
		global.location.hash = '';
		registry = createTestRegistry();

		provideModules( registry, [
			{
				slug: 'analytics',
				active: true,
				connected: true,
			},
			{
				slug: 'pagespeed-insights',
				active: true,
				connected: true,
			},
			{
				slug: 'tagmanager',
				active: true,
				// Intentionally not connected here with both settings components for tests below.
				connected: false,
			},
			{
				slug: 'analytics-4',
				active: true,
				// Intentionally not connected here with both settings components for tests below.
				connected: false,
			},
		] );
	} );

	it( 'should render "Connected" for a connected module', () => {
		const { container } = render( <Header slug="pagespeed-insights" />, {
			registry,
		} );

		expect( container ).toHaveTextContent( 'Connected' );
	} );

	it( 'should render a button to complete setup for a non-connected module', () => {
		const { queryByRole } = render( <Header slug="tagmanager" />, {
			registry,
		} );

		const button = queryByRole( 'button' );
		expect( button ).toBeInTheDocument();
		expect( button ).toHaveTextContent( 'Complete setup for Tag Manager' );
	} );

	it( 'should render a button to connect GA4 if Analytics is connected but GA4 is not', () => {
		const { queryByRole } = render( <Header slug="analytics" />, {
			registry,
		} );

		const button = queryByRole( 'button' );
		expect( button ).toBeInTheDocument();
		expect( button ).toHaveTextContent( 'Connect Google Analytics 4' );
	} );

	it( 'should open the tab when ENTER key is pressed', () => {
		history.push( '/connected-services' );

		const { container } = render( <HeaderAwareRouter />, {
			registry,
			history,
		} );

		const headerElement = container.querySelector(
			'.googlesitekit-settings-module__header'
		);

		fireEvent.keyDown( headerElement, { keyCode: ENTER } );
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( true );
	} );

	it( 'should close the tab if opened when ENTER key is pressed', () => {
		history.push( '/connected-services/pagespeed-insights' );

		const { container } = render( <HeaderAwareRouter />, {
			registry,
			history,
		} );

		const headerElement = container.querySelector(
			'.googlesitekit-settings-module__header'
		);

		fireEvent.keyDown( headerElement, { keyCode: ENTER } );
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( false );
	} );

	it( 'should close the tab if opened when ESCAPE key is pressed', () => {
		history.push( '/connected-services/pagespeed-insights' );

		const { container } = render( <HeaderAwareRouter />, {
			registry,
			history,
		} );

		const headerElement = container.querySelector(
			'.googlesitekit-settings-module__header'
		);

		fireEvent.keyDown( headerElement, { keyCode: ESCAPE } );
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( false );
	} );

	it( 'should not toggle the tab if any other key is pressed', () => {
		// Ensure the tab is closed.
		history.push( '/connected-services' );

		const { container } = render( <HeaderAwareRouter />, {
			registry,
			history,
		} );

		const headerElement = container.querySelector(
			'.googlesitekit-settings-module__header'
		);

		fireEvent.keyDown( headerElement, { keyCode: DOWN } );
		// Ensure the tab is still closed after pressing the DOWN key.
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( false );

		// Ensure the tab is open.
		history.push( '/connected-services/pagespeed-insights' );

		fireEvent.keyDown( headerElement, { keyCode: UP } );
		// Ensure the tab is still open after pressing the UP key.
		expect(
			headerElement.classList.contains(
				'googlesitekit-settings-module__header--open'
			)
		).toBe( true );
	} );
} );
{'fraction_non_alphanumeric': 0.13483489604565838, 'fraction_numerical': 0.0024459845087647777, 'mean_word_length': 3.296409807355517, 'pattern_counts': {'":': 0, '<': 26, '<?xml version=': 0, '>': 45, 'https://': 2, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4555142', 'n_tokens_mistral': 3409, 'n_tokens_neox': 2944, 'n_words': 844}