import {render, screen, waitFor} from 'sentry-test/reactTestingLibrary';
import {openSudo} from 'sentry/actionCreators/modal';
import * as OrganizationActionCreator from 'sentry/actionCreators/organization';
import ConfigStore from 'sentry/stores/configStore';
import OrganizationStore from 'sentry/stores/organizationStore';
import ProjectsStore from 'sentry/stores/projectsStore';
import TeamStore from 'sentry/stores/teamStore';
import useOrganization from 'sentry/utils/useOrganization';
import {OrganizationLegacyContext} from 'sentry/views/organizationContextContainer';
jest.mock('sentry/stores/configStore', () => ({
get: jest.fn(),
}));
jest.mock('sentry/actionCreators/modal', () => ({
openSudo: jest.fn(),
}));
describe('OrganizationContextContainer', function () {
const org = TestStubs.Organization();
const teams = [TestStubs.Team()];
const projects = [TestStubs.Project()];
const api = new MockApiClient();
let getOrgMock;
let getProjectsMock;
let getTeamsMock;
function DisplayOrg() {
const contextOrg = useOrganization();
return
{contextOrg.slug}
;
}
function makeComponent(props) {
return (
);
}
function renderComponent(props) {
return render(makeComponent(props));
}
beforeEach(function () {
MockApiClient.clearMockResponses();
getOrgMock = MockApiClient.addMockResponse({
url: '/organizations/org-slug/',
body: org,
});
getProjectsMock = MockApiClient.addMockResponse({
url: '/organizations/org-slug/projects/',
body: projects,
});
getTeamsMock = MockApiClient.addMockResponse({
url: '/organizations/org-slug/teams/',
body: teams,
});
jest.spyOn(TeamStore, 'loadInitialData');
jest.spyOn(ProjectsStore, 'loadInitialData');
jest.spyOn(OrganizationActionCreator, 'fetchOrganizationDetails');
});
afterEach(function () {
OrganizationStore.reset();
jest.restoreAllMocks();
});
it('renders and fetches org, projects, and teams', async function () {
renderComponent();
await waitFor(() => expect(getOrgMock).toHaveBeenCalled());
expect(getProjectsMock).toHaveBeenCalled();
expect(getTeamsMock).toHaveBeenCalled();
expect(screen.queryByRole('loading-indicator')).not.toBeInTheDocument();
expect(screen.getByText(org.slug)).toBeInTheDocument();
expect(
screen.queryByText('The organization you were looking for was not found.')
).not.toBeInTheDocument();
expect(TeamStore.loadInitialData).toHaveBeenCalledWith(teams);
expect(ProjectsStore.loadInitialData).toHaveBeenCalledWith(projects);
expect(OrganizationActionCreator.fetchOrganizationDetails).toHaveBeenCalledWith(
api,
'org-slug',
true,
true
);
});
it('fetches new org when router params change', async function () {
const newOrg = TestStubs.Organization({slug: 'new-slug'});
const {rerender} = renderComponent();
expect(await screen.findByText(org.slug)).toBeInTheDocument();
const mock = MockApiClient.addMockResponse({
url: '/organizations/new-slug/',
body: newOrg,
});
const projectsMock = MockApiClient.addMockResponse({
url: '/organizations/new-slug/projects/',
body: projects,
});
const teamsMock = MockApiClient.addMockResponse({
url: '/organizations/new-slug/teams/',
body: teams,
});
// Re-render with new org slug
rerender(makeComponent({params: {orgId: newOrg.slug}}));
// Loads new org
expect(screen.getByTestId('loading-indicator')).toBeInTheDocument();
// Renders new org
expect(await screen.findByText(newOrg.slug)).toBeInTheDocument();
expect(mock).toHaveBeenLastCalledWith('/organizations/new-slug/', expect.anything());
expect(projectsMock).toHaveBeenCalled();
expect(teamsMock).toHaveBeenCalled();
});
it('shows loading error for non-superusers on 403s', async function () {
getOrgMock = MockApiClient.addMockResponse({
url: '/organizations/org-slug/',
statusCode: 403,
});
jest.spyOn(console, 'error').mockImplementation(jest.fn()); // eslint-disable-line no-console
renderComponent();
expect(
await screen.findByText('There was an error loading data.')
).toBeInTheDocument();
// eslint-disable-next-line no-console
expect(console.error).toHaveBeenCalled();
});
it('opens sudo modal for superusers on 403s', async function () {
ConfigStore.get.mockImplementation(() => ({
isSuperuser: true,
}));
getOrgMock = MockApiClient.addMockResponse({
url: '/organizations/org-slug/',
statusCode: 403,
});
renderComponent();
await waitFor(() => expect(openSudo).toHaveBeenCalled());
});
it('uses last organization from ConfigStore', function () {
getOrgMock = MockApiClient.addMockResponse({
url: '/organizations/last-org/',
body: org,
});
MockApiClient.addMockResponse({
url: '/organizations/last-org/projects/',
body: projects,
});
MockApiClient.addMockResponse({
url: '/organizations/last-org/teams/',
body: teams,
});
// mocking `.get('lastOrganization')`
ConfigStore.get.mockImplementation(() => 'last-org');
renderComponent({useLastOrganization: true, params: {}});
expect(getOrgMock).toHaveBeenLastCalledWith(
'/organizations/last-org/',
expect.anything()
);
});
it('uses last organization from `organizations` prop', async function () {
MockApiClient.addMockResponse({
url: '/organizations/foo/environments/',
body: TestStubs.Environments(),
});
getOrgMock = MockApiClient.addMockResponse({
url: '/organizations/foo/',
body: org,
});
getProjectsMock = MockApiClient.addMockResponse({
url: '/organizations/foo/projects/',
body: projects,
});
getTeamsMock = MockApiClient.addMockResponse({
url: '/organizations/foo/teams/',
body: teams,
});
ConfigStore.get.mockImplementation(() => '');
const {rerender} = renderComponent({
params: {orgId: ''},
useLastOrganization: true,
organizationsLoading: true,
organizations: [],
});
expect(screen.getByTestId('loading-indicator')).toBeInTheDocument();
rerender(
makeComponent({
params: {orgId: ''},
useLastOrganization: true,
organizationsLoading: false,
organizations: [
TestStubs.Organization({slug: 'foo'}),
TestStubs.Organization({slug: 'bar'}),
],
})
);
expect(await screen.findByText(org.slug)).toBeInTheDocument();
expect(getOrgMock).toHaveBeenCalled();
expect(getProjectsMock).toHaveBeenCalled();
expect(getTeamsMock).toHaveBeenCalled();
});
it('uses last organization when no orgId in URL - and fetches org details once', async function () {
ConfigStore.get.mockImplementation(() => 'my-last-org');
getOrgMock = MockApiClient.addMockResponse({
url: '/organizations/my-last-org/',
body: TestStubs.Organization({slug: 'my-last-org'}),
});
getProjectsMock = MockApiClient.addMockResponse({
url: '/organizations/my-last-org/projects/',
body: projects,
});
getTeamsMock = MockApiClient.addMockResponse({
url: '/organizations/my-last-org/teams/',
body: teams,
});
const {rerender} = renderComponent({
params: {},
useLastOrganization: true,
organizations: [],
});
expect(await screen.findByText('my-last-org')).toBeInTheDocument();
expect(getOrgMock).toHaveBeenCalledTimes(1);
// Simulate OrganizationsStore being loaded *after* `OrganizationContext` finishes
// org details fetch
rerender(
makeComponent({
params: {},
useLastOrganization: true,
organizationsLoading: false,
organizations: [
TestStubs.Organization({slug: 'foo'}),
TestStubs.Organization({slug: 'bar'}),
],
})
);
expect(getOrgMock).toHaveBeenCalledTimes(1);
expect(getProjectsMock).toHaveBeenCalledTimes(1);
expect(getTeamsMock).toHaveBeenCalledTimes(1);
});
it('fetches org details only once if organizations loading store changes', async function () {
const {rerender} = renderComponent({
params: {orgId: 'org-slug'},
organizationsLoading: true,
organizations: [],
});
expect(await screen.findByText(org.slug)).toBeInTheDocument();
expect(getOrgMock).toHaveBeenCalledTimes(1);
// Simulate OrganizationsStore being loaded *after* `OrganizationContext` finishes
// org details fetch
rerender(
makeComponent({
params: {orgId: 'org-slug'},
organizationsLoading: false,
organizations: [
TestStubs.Organization({slug: 'foo'}),
TestStubs.Organization({slug: 'bar'}),
],
})
);
expect(getOrgMock).toHaveBeenCalledTimes(1);
expect(getProjectsMock).toHaveBeenCalledTimes(1);
expect(getTeamsMock).toHaveBeenCalledTimes(1);
});
});