diff --git a/frontend/app/components/auth-panel/auth-panel.test.tsx b/frontend/app/components/auth-panel/auth-panel.test.tsx
index 001f33c7..c00882fb 100644
--- a/frontend/app/components/auth-panel/auth-panel.test.tsx
+++ b/frontend/app/components/auth-panel/auth-panel.test.tsx
@@ -43,23 +43,60 @@ describe('', () => {
expect(providerLinks[1].textContent).toEqual('GitHub');
});
- it('should place selected provider first', () => {
- const element = ;
+ describe('sorting', () => {
+ it('should place selected provider first', () => {
+ const element = (
+
+ );
- render(element, container);
+ render(element, container);
- const authPanelColumn = container.querySelectorAll('.auth-panel__column');
+ const authPanelColumn = container.querySelectorAll('.auth-panel__column');
- expect(authPanelColumn.length).toEqual(2);
+ expect(authPanelColumn.length).toEqual(2);
- const authForm = authPanelColumn[0];
+ const authForm = authPanelColumn[0];
- expect(authForm.textContent).toEqual(expect.stringContaining('Sign in to comment using'));
+ expect(authForm.textContent).toEqual(expect.stringContaining('Sign in to comment using'));
- const providerLinks = authForm.querySelectorAll('.auth-panel__pseudo-link');
+ const providerLinks = authForm.querySelectorAll('.auth-panel__pseudo-link');
- expect(providerLinks[0].textContent).toEqual('GitHub');
- expect(providerLinks[1].textContent).toEqual('Google');
+ expect(providerLinks[0].textContent).toEqual('GitHub');
+ expect(providerLinks[1].textContent).toEqual('Google');
+ expect(providerLinks[2].textContent).toEqual('Yandex');
+ });
+
+ it('should do nothing if provider not found', () => {
+ const element = (
+
+ );
+
+ render(element, container);
+
+ const authPanelColumn = container.querySelectorAll('.auth-panel__column');
+
+ expect(authPanelColumn.length).toEqual(2);
+
+ const authForm = authPanelColumn[0];
+
+ expect(authForm.textContent).toEqual(expect.stringContaining('Sign in to comment using'));
+
+ const providerLinks = authForm.querySelectorAll('.auth-panel__pseudo-link');
+
+ expect(providerLinks[0].textContent).toEqual('Google');
+ expect(providerLinks[1].textContent).toEqual('GitHub');
+ expect(providerLinks[2].textContent).toEqual('Yandex');
+ });
});
it('should render login form with google and github provider for read-only post', () => {
diff --git a/frontend/app/components/auth-panel/auth-panel.tsx b/frontend/app/components/auth-panel/auth-panel.tsx
index 30fc4363..8e0da2a5 100644
--- a/frontend/app/components/auth-panel/auth-panel.tsx
+++ b/frontend/app/components/auth-panel/auth-panel.tsx
@@ -243,7 +243,7 @@ export class AuthPanel extends Component {
const sortedProviders = ((): typeof providers => {
if (!this.props.provider.name) return providers;
const lastProviderIndex = providers.indexOf(this.props.provider.name as typeof providers[0]);
- if (!lastProviderIndex) return providers;
+ if (lastProviderIndex < 1) return providers;
return [
this.props.provider.name as typeof providers[0],
...providers.slice(0, lastProviderIndex),