@api-client/ui 0.5.38 → 0.5.40

package/test/elements/authorization/ntlm-method.test.ts

@@ -1,219 +0,0 @@
-import { html, fixture, assert, oneEvent } from '@open-wc/testing'
-import { INtlmAuthorization, IRequestAuthorization, RequestAuthorization } from '@api-client/core/browser.js'
-import { Authorization } from '../../../src/elements/authorization/ui/Authorization.js'
-import Input from '../../../src/md/input/Input.js'
-import '../../../src/define/authorization/ntlm-authorization.js'
-
-describe('NTLM method', () => {
-  const usernameSelector = 'ui-filled-text-field[name="username"]'
-  const passwordSelector = 'ui-filled-text-field[name="password"]'
-  const domainSelector = 'ui-filled-text-field[name="domain"]'
-
-  const username = 'test-username'
-  const password = 'test-password'
-  const domain = 'test-domain'
-
-  async function basicFixture(auth?: IRequestAuthorization): Promise<Authorization> {
-    return fixture(html`<ntlm-authorization .authorization="${auth}"></ntlm-authorization>`)
-  }
-
-  describe('DOM rendering', () => {
-    let element: Authorization
-    let form: HTMLFormElement
-
-    beforeEach(async () => {
-      const auth = RequestAuthorization.fromTypedConfig('ntlm', {}).toJSON()
-      element = await basicFixture(auth)
-      form = element.shadowRoot!.querySelector('form')!
-    })
-
-    it('has form in the DOM', async () => {
-      assert.ok(form)
-    })
-
-    it('has form has autocomplete', async () => {
-      assert.equal(form.getAttribute('autocomplete'), 'on')
-    })
-
-    it('form has username input', async () => {
-      const input = form.querySelector(usernameSelector)
-      assert.ok(input)
-    })
-
-    it('username is required', async () => {
-      const input = form.querySelector(usernameSelector) as Input
-      assert.isTrue(input.required)
-    })
-
-    it('username has the invalid label', async () => {
-      const input = form.querySelector(usernameSelector) as Input
-      assert.equal(input.invalidText, 'Username is required')
-    })
-
-    it('form has password input', async () => {
-      const input = form.querySelector(passwordSelector)
-      assert.ok(input)
-    })
-
-    it('password is not required', async () => {
-      const input = form.querySelector(passwordSelector) as Input
-      assert.notOk(input.required)
-    })
-
-    it('form has domain input', async () => {
-      const input = form.querySelector(domainSelector)
-      assert.ok(input)
-    })
-
-    it('domain is not required', async () => {
-      const input = form.querySelector(domainSelector) as Input
-      assert.notOk(input.required)
-    })
-
-    it('has no other inputs', () => {
-      const controls = form.querySelectorAll('ui-filled-text-field')
-      assert.lengthOf(controls, 3)
-    })
-  })
-
-  describe('change notification', () => {
-    let element: Authorization
-    beforeEach(async () => {
-      const auth = RequestAuthorization.fromTypedConfig('ntlm', {}).toJSON()
-      element = await basicFixture(auth)
-    })
-
-    it('notifies when username changes', async () => {
-      const input = element.shadowRoot!.querySelector(usernameSelector) as Input
-      setTimeout(() => {
-        input.value = 'test'
-        input.dispatchEvent(new CustomEvent('change'))
-      })
-      const e = await oneEvent(element, 'change')
-      assert.ok(e)
-    })
-
-    it('notifies when password changes', async () => {
-      const input = element.shadowRoot!.querySelector(passwordSelector) as Input
-      setTimeout(() => {
-        input.value = 'test'
-        input.dispatchEvent(new CustomEvent('change'))
-      })
-      const e = await oneEvent(element, 'change')
-      assert.ok(e)
-    })
-
-    it('notifies when domain changes', async () => {
-      const input = element.shadowRoot!.querySelector(domainSelector) as Input
-      setTimeout(() => {
-        input.value = 'test'
-        input.dispatchEvent(new CustomEvent('change'))
-      })
-      const e = await oneEvent(element, 'change')
-      assert.ok(e)
-    })
-  })
-
-  describe('updating the model', () => {
-    let element: Authorization
-    beforeEach(async () => {
-      const auth = RequestAuthorization.fromTypedConfig('ntlm', {
-        username,
-        password,
-        domain,
-      }).toJSON()
-      element = await basicFixture(auth)
-    })
-
-    it('updates the username from user input', () => {
-      const input = element.shadowRoot!.querySelector(usernameSelector) as Input
-      input.value = 'test'
-      input.dispatchEvent(new Event('change'))
-      const config = element.authorization!.config as INtlmAuthorization
-      assert.equal(config.username, 'test')
-    })
-
-    it('updates the password from user input', () => {
-      const input = element.shadowRoot!.querySelector(passwordSelector) as Input
-      input.value = 'test'
-      input.dispatchEvent(new Event('change'))
-      const config = element.authorization!.config as INtlmAuthorization
-      assert.equal(config.password, 'test')
-    })
-
-    it('updates the domain from user input', () => {
-      const input = element.shadowRoot!.querySelector(domainSelector) as Input
-      input.value = 'test'
-      input.dispatchEvent(new Event('change'))
-      const config = element.authorization!.config as INtlmAuthorization
-      assert.equal(config.domain, 'test')
-    })
-  })
-
-  describe('data restoration', () => {
-    let element: Authorization
-    beforeEach(async () => {
-      const auth = RequestAuthorization.fromTypedConfig('ntlm', {
-        username,
-        password,
-        domain,
-      }).toJSON()
-      element = await basicFixture(auth)
-    })
-
-    it('has the value on the username filed', () => {
-      const input = element.shadowRoot!.querySelector(usernameSelector) as Input
-      assert.equal(input.value, username)
-    })
-
-    it('has the value on the password filed', () => {
-      const input = element.shadowRoot!.querySelector(passwordSelector) as Input
-      assert.equal(input.value, password)
-    })
-
-    it('has the value on the domain filed', () => {
-      const input = element.shadowRoot!.querySelector(domainSelector) as Input
-      assert.equal(input.value, domain)
-    })
-  })
-
-  describe('validation', () => {
-    let element: Authorization
-    beforeEach(async () => {
-      const auth = RequestAuthorization.fromTypedConfig('ntlm', {}).toJSON()
-      element = await basicFixture(auth)
-    })
-
-    it('is not valid without the username', () => {
-      const result = element.checkValidity()
-      assert.isFalse(result)
-    })
-
-    it('is valid with the username', async () => {
-      ;(element.authorization!.config as INtlmAuthorization).username = 'test-username'
-      element.requestUpdate()
-      await element.updateComplete
-      const result = element.checkValidity()
-      assert.isTrue(result)
-    })
-  })
-
-  describe('a11y', () => {
-    it('is accessible without the model', async () => {
-      const element = await basicFixture()
-      await assert.isAccessible(element)
-    })
-
-    it('is accessible when empty', async () => {
-      const auth = RequestAuthorization.fromTypedConfig('ntlm', {}).toJSON()
-      const element = await basicFixture(auth)
-      await assert.isAccessible(element)
-    })
-
-    it('is accessible with values', async () => {
-      const auth = RequestAuthorization.fromTypedConfig('ntlm', { username, password, domain }).toJSON()
-      const element = await basicFixture(auth)
-      await assert.isAccessible(element)
-    })
-  })
-})

package/test/elements/authorization/oauth2-client-credentials-method.test.ts

@@ -1,334 +0,0 @@
-import { html, fixture, assert, oneEvent } from '@open-wc/testing'
-import { spy } from 'sinon'
-import {
-  EventTypes,
-  IOAuth2Authorization,
-  IRequestAuthorization,
-  RequestAuthorizationKind,
-} from '@api-client/core/browser.js'
-import OAuth2Authorization from '../../../src/elements/authorization/ui/OAuth2Authorization.js'
-import Input from '../../../src/md/input/Input.js'
-import { Oauth2Credentials } from '../../../src/elements/authorization/types.js'
-import UiListItem from '../../../src/md/list/internals/ListItem.js'
-import '../../../src/define/authorization/oauth2-authorization.js'
-
-describe('Authorization', () => {
-  describe('<oauth2-authorization>', () => {
-    describe('client_credentials', () => {
-      const baseConfig: IOAuth2Authorization = {
-        grantType: 'client_credentials',
-        clientId: 'test-client-id',
-        clientSecret: 'test-secret-client',
-        accessTokenUri: 'https://accounts.google.com/o/oauth2/v2/token',
-        scopes: ['email', 'profile'],
-        deliveryMethod: 'header',
-      }
-
-      async function basicFixture(opts: IOAuth2Authorization = {}): Promise<OAuth2Authorization> {
-        const auth: IRequestAuthorization = {
-          config: opts,
-          enabled: true,
-          kind: RequestAuthorizationKind,
-          type: 'oauth 2',
-          valid: true,
-        }
-        return fixture(html`<oauth2-authorization .authorization="${auth}"></oauth2-authorization>`)
-      }
-
-      async function baseUriFixture(baseUri: string, opts: IOAuth2Authorization): Promise<OAuth2Authorization> {
-        const auth: IRequestAuthorization = {
-          config: opts,
-          enabled: true,
-          kind: RequestAuthorizationKind,
-          type: 'oauth 2',
-          valid: true,
-        }
-        return fixture(
-          html`<oauth2-authorization .authorization="${auth}" .baseUri="${baseUri}"></oauth2-authorization>`
-        )
-      }
-
-      async function credentialSourceFixture(
-        credentialsSource: Oauth2Credentials[],
-        opts: IOAuth2Authorization
-      ): Promise<OAuth2Authorization> {
-        const auth: IRequestAuthorization = {
-          config: opts,
-          enabled: true,
-          kind: RequestAuthorizationKind,
-          type: 'oauth 2',
-          valid: true,
-        }
-        return fixture(
-          html`<oauth2-authorization
-            .authorization="${auth}"
-            .credentialsSource="${credentialsSource}"
-          ></oauth2-authorization>`
-        )
-      }
-
-      describe('DOM rendering', () => {
-        let element: OAuth2Authorization
-        let form: HTMLFormElement
-        beforeEach(async () => {
-          element = await basicFixture({ ...baseConfig })
-          form = element.shadowRoot!.querySelector('form')!
-        })
-
-        it(`has the clientId input`, async () => {
-          const input = form.querySelector(`[name="clientId"]`) as Input
-          assert.ok(input, 'has the input')
-        })
-
-        it(`has the clientSecret input`, async () => {
-          const input = form.querySelector(`[name="clientSecret"]`) as Input
-          assert.ok(input, 'has the input')
-        })
-
-        it(`has the accessTokenUri input`, async () => {
-          const input = form.querySelector(`[name="accessTokenUri"]`) as Input
-          assert.ok(input, 'has the input')
-        })
-
-        it('client secret is not required', async () => {
-          const input = form.querySelector(`[name="clientSecret"]`) as Input
-          assert.notOk(input.required)
-        })
-
-        it('does not render the redirect URI field', async () => {
-          const section = element.shadowRoot!.querySelector('[name="redirectUri"]')
-          assert.notOk(section)
-        })
-
-        it('does not render the PKCE checkbox', async () => {
-          const node = element.shadowRoot!.querySelector('[name="pkce"]')
-          assert.notOk(node)
-        })
-
-        it('renders the delivery method drop down', async () => {
-          const input = element.shadowRoot!.querySelector('*[name="deliveryMethod"]') as Input
-          assert.ok(input)
-        })
-      })
-
-      describe('Data initialization', () => {
-        let element: OAuth2Authorization
-        beforeEach(async () => {
-          element = await basicFixture({ ...baseConfig })
-        })
-
-        it(`has the clientId`, async () => {
-          const input = element.shadowRoot!.querySelector(`*[name="clientId"]`) as Input
-          assert.equal(input.value, baseConfig.clientId)
-        })
-
-        it(`has the clientSecret`, async () => {
-          const input = element.shadowRoot!.querySelector(`*[name="clientSecret"]`) as Input
-          assert.equal(input.value, baseConfig.clientSecret)
-        })
-
-        it(`has the accessTokenUri input`, async () => {
-          const input = element.shadowRoot!.querySelector(`*[name="accessTokenUri"]`) as Input
-          assert.equal(input.value, baseConfig.accessTokenUri)
-        })
-
-        it('has the delivery method', async () => {
-          const input = element.shadowRoot!.querySelector('*[name="deliveryMethod"]') as Input
-          assert.equal(input.dataset.selected, baseConfig.deliveryMethod)
-        })
-      })
-
-      describe('Change notification', () => {
-        let element: OAuth2Authorization
-        beforeEach(async () => {
-          element = await basicFixture({ ...baseConfig })
-        })
-
-        it(`notifies when clientId changes`, async () => {
-          setTimeout(() => {
-            const input = element.shadowRoot!.querySelector(`[name="clientId"]`) as Input
-            input.value = 'changed'
-            input.dispatchEvent(new CustomEvent('change'))
-          })
-          const e = await oneEvent(element, 'change')
-          assert.ok(e)
-        })
-
-        it(`notifies when clientSecret changes`, async () => {
-          setTimeout(() => {
-            const input = element.shadowRoot!.querySelector(`[name="clientSecret"]`) as Input
-            input.value = 'changed'
-            input.dispatchEvent(new CustomEvent('change'))
-          })
-          const e = await oneEvent(element, 'change')
-          assert.ok(e)
-        })
-
-        it(`notifies when accessTokenUri changes`, async () => {
-          setTimeout(() => {
-            const input = element.shadowRoot!.querySelector(`[name="accessTokenUri"]`) as Input
-            input.value = 'changed'
-            input.dispatchEvent(new CustomEvent('change'))
-          })
-          const e = await oneEvent(element, 'change')
-          assert.ok(e)
-        })
-
-        it(`notifies when deliveryMethod changes`, async () => {
-          setTimeout(() => {
-            const item = element.shadowRoot!.querySelector(`.delivery-method-line [data-value="body"]`) as UiListItem
-            item.click()
-          })
-          const e = await oneEvent(element, 'change')
-          assert.ok(e)
-        })
-      })
-
-      describe('Data serialization', () => {
-        let element: OAuth2Authorization
-        beforeEach(async () => {
-          element = await basicFixture({ ...baseConfig })
-        })
-
-        it(`serializes the clientId`, async () => {
-          const result = element.serialize()
-          assert.equal(result.clientId, baseConfig.clientId)
-        })
-
-        it(`serializes the clientSecret`, async () => {
-          const result = element.serialize()
-          assert.equal(result.clientSecret, baseConfig.clientSecret)
-        })
-
-        it(`serializes the accessTokenUri`, async () => {
-          const result = element.serialize()
-          assert.equal(result.accessTokenUri, baseConfig.accessTokenUri)
-        })
-
-        it(`serializes the scopes`, async () => {
-          const result = element.serialize()
-          assert.deepEqual(result.scopes, baseConfig.scopes)
-        })
-
-        it(`serializes the deliveryMethod`, async () => {
-          const result = element.serialize()
-          assert.deepEqual(result.deliveryMethod, baseConfig.deliveryMethod)
-        })
-      })
-
-      describe('authorization event', () => {
-        let element: OAuth2Authorization
-
-        beforeEach(async () => {
-          element = await basicFixture({ ...baseConfig })
-        })
-
-        it(`sets the serialized values onto the event`, async () => {
-          const handler = spy()
-          element.addEventListener(EventTypes.Authorization.OAuth2.authorize, handler)
-          element.authorize()
-          const { detail } = handler.args[0][0] as CustomEvent<IOAuth2Authorization & { result?: unknown }>
-          delete detail.state
-          delete detail.result
-          assert.deepEqual(detail, element.serialize())
-        })
-      })
-
-      describe('application grant type', () => {
-        let element: OAuth2Authorization
-
-        beforeEach(async () => {
-          const opts = {
-            ...baseConfig,
-            grantType: 'application',
-          }
-          element = await basicFixture(opts)
-        })
-
-        it(`authorization event has credentials when grant_type is application`, async () => {
-          const handler = spy()
-          element.addEventListener(EventTypes.Authorization.OAuth2.authorize, handler)
-          await element.authorize()
-          const { detail } = handler.args[0][0]
-          assert.equal(detail.grantType, 'application')
-          assert.equal(detail.clientId, baseConfig.clientId)
-          assert.equal(detail.clientSecret, baseConfig.clientSecret)
-        })
-      })
-
-      describe('#baseUri', () => {
-        const baseUri = 'https://api.domain.com/auth'
-
-        it('adds base URI to accessTokenUri', async () => {
-          const params = { ...baseConfig }
-          params.accessTokenUri = '/authorize'
-          const element = await baseUriFixture(baseUri, params)
-          const result = element.serialize()
-          assert.equal(result.accessTokenUri, 'https://api.domain.com/auth/authorize')
-        })
-
-        it('ignores trailing slash', async () => {
-          const uri = `${baseUri}/`
-          const params = { ...baseConfig }
-          params.accessTokenUri = '/authorize'
-          const element = await baseUriFixture(uri, params)
-          const result = element.serialize()
-          assert.equal(result.accessTokenUri, 'https://api.domain.com/auth/authorize')
-        })
-
-        it('makes accessTokenUri input text type', async () => {
-          const element = await baseUriFixture(baseUri, { ...baseConfig })
-          const node = element.shadowRoot!.querySelector('[name="accessTokenUri"]') as Input
-          assert.equal(node.type, 'string')
-        })
-      })
-
-      describe('Credentials source', () => {
-        const credentials: Oauth2Credentials[] = [
-          {
-            grantType: 'client_credentials',
-            credentials: [
-              { name: 'My social Network', clientId: '123', clientSecret: 'xyz' },
-              { name: 'My social Network 2', clientId: '1234', clientSecret: 'wxyz' },
-            ],
-          },
-        ]
-
-        let element: OAuth2Authorization
-        beforeEach(async () => {
-          element = await credentialSourceFixture(credentials, { ...baseConfig })
-        })
-
-        it('renders credentials source dropdown', async () => {
-          assert.isNotNull(element.shadowRoot!.querySelector('[name="credentialSource"]'))
-        })
-
-        it('should fill clientId and clientSecret as read only from source', async () => {
-          setTimeout(() => {
-            const item = element.shadowRoot!.querySelector(
-              `.credential-source-list [data-value="${credentials[0].credentials[0].name}"]`
-            ) as UiListItem
-            item.click()
-          })
-          const e = await oneEvent(element, 'change')
-          assert.ok(e)
-          assert.equal(element.config.clientSecret, 'xyz')
-          assert.equal(element.config.clientId, '123')
-          assert.isTrue(element.credentialsDisabled)
-        })
-      })
-
-      describe('a11y', () => {
-        let element: OAuth2Authorization
-
-        beforeEach(async () => {
-          element = await basicFixture({ ...baseConfig })
-        })
-
-        it('passes automated a11y tests', async () => {
-          await assert.isAccessible(element)
-        })
-      })
-    })
-  })
-})