@internetarchive/ia-topnav 1.4.1-alpha-webdev8259.0 → 1.4.1-alpha-webdev8259.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/dist/index.d.ts +0 -1
  2. package/dist/index.js.map +1 -1
  3. package/dist/src/data/menus.js.map +1 -1
  4. package/dist/src/dropdown-menu.js +26 -26
  5. package/dist/src/dropdown-menu.js.map +1 -1
  6. package/dist/src/ia-topnav.d.ts +2 -13
  7. package/dist/src/ia-topnav.js +70 -140
  8. package/dist/src/ia-topnav.js.map +1 -1
  9. package/dist/src/lib/keyboard-navigation.js.map +1 -1
  10. package/dist/src/login-button.js +17 -17
  11. package/dist/src/login-button.js.map +1 -1
  12. package/dist/src/media-menu.js +21 -21
  13. package/dist/src/media-menu.js.map +1 -1
  14. package/dist/src/models.d.ts +0 -1
  15. package/dist/src/models.js.map +1 -1
  16. package/dist/src/primary-nav.d.ts +6 -7
  17. package/dist/src/primary-nav.js +98 -142
  18. package/dist/src/primary-nav.js.map +1 -1
  19. package/dist/src/styles/login-button.js +87 -87
  20. package/dist/src/styles/login-button.js.map +1 -1
  21. package/dist/src/styles/primary-nav.js +343 -343
  22. package/dist/src/styles/primary-nav.js.map +1 -1
  23. package/dist/src/user-menu.js +13 -13
  24. package/dist/src/user-menu.js.map +1 -1
  25. package/dist/test/ia-topnav.test.js +15 -87
  26. package/dist/test/ia-topnav.test.js.map +1 -1
  27. package/dist/test/primary-nav.test.js +16 -34
  28. package/dist/test/primary-nav.test.js.map +1 -1
  29. package/index.ts +3 -4
  30. package/package.json +1 -1
  31. package/src/data/menus.ts +652 -652
  32. package/src/dropdown-menu.ts +132 -132
  33. package/src/ia-topnav.ts +301 -383
  34. package/src/lib/keyboard-navigation.ts +166 -166
  35. package/src/login-button.ts +78 -78
  36. package/src/media-menu.ts +143 -143
  37. package/src/models.ts +63 -65
  38. package/src/primary-nav.ts +277 -324
  39. package/src/styles/login-button.ts +90 -90
  40. package/src/styles/primary-nav.ts +346 -346
  41. package/src/user-menu.ts +32 -32
  42. package/test/ia-topnav.test.ts +282 -381
  43. package/test/primary-nav.test.ts +136 -163
@@ -1,163 +1,136 @@
1
- import {
2
- html,
3
- fixture,
4
- expect,
5
- fixtureCleanup,
6
- elementUpdated,
7
- } from '@open-wc/testing';
8
-
9
- import '../src/primary-nav';
10
- import {
11
- IATopNavConfig,
12
- IATopNavSearchSlotMode,
13
- IATopNavSecondIdentitySlotMode,
14
- } from '../src/models';
15
- import { PrimaryNav } from '../src/primary-nav';
16
-
17
- const component = ({
18
- baseHost = 'archive.org',
19
- username = '',
20
- screenName = '',
21
- hideSearch = false,
22
- config = {},
23
- searchSlotMode = '',
24
- secondIdentitySlotMode = 'allow',
25
- }: {
26
- baseHost?: string;
27
- username?: string;
28
- screenName?: string;
29
- hideSearch?: boolean;
30
- config?: IATopNavConfig;
31
- searchSlotMode?: IATopNavSearchSlotMode;
32
- secondIdentitySlotMode?: IATopNavSecondIdentitySlotMode;
33
- }) =>
34
- html` <primary-nav
35
- .baseHost=${baseHost}
36
- .username=${username}
37
- .screenName=${screenName}
38
- ?hideSearch=${hideSearch}
39
- .config=${config}
40
- .searchSlotMode=${searchSlotMode}
41
- .secondIdentitySlotMode=${secondIdentitySlotMode}
42
- ></primary-nav>`;
43
-
44
- afterEach(() => {
45
- fixtureCleanup();
46
- });
47
-
48
- describe('<primary-nav>', () => {
49
- it('renders the login link when no username present', async () => {
50
- const el = await fixture<PrimaryNav>(
51
- component({
52
- baseHost: 'archive.org',
53
- username: '',
54
- }),
55
- );
56
-
57
- expect(el.shadowRoot?.querySelector('login-button')).to.not.be.undefined;
58
- });
59
-
60
- it('does not render search menu toggle and search form if hideSearch true', async () => {
61
- const el = await fixture<PrimaryNav>(
62
- component({
63
- baseHost: 'archive.org',
64
- username: 'shaneriley',
65
- screenName: 'shaneriley',
66
- hideSearch: true,
67
- }),
68
- );
69
-
70
- expect(el.shadowRoot?.querySelector('.search-trigger')).to.equal(null);
71
- expect(el.shadowRoot?.querySelector('nav-search')).to.equal(null);
72
- });
73
-
74
- it('renders nav-search by default', async () => {
75
- const el = await fixture<PrimaryNav>(
76
- component({
77
- baseHost: 'archive.org',
78
- username: 'testuser',
79
- screenName: 'testuser',
80
- }),
81
- );
82
-
83
- expect(el.shadowRoot?.querySelector('nav-search')).to.exist;
84
- expect(el.shadowRoot?.querySelector('.custom-search-container')).to.not
85
- .exist;
86
- });
87
-
88
- it('renders custom-search slot when searchSlotMode is "custom"', async () => {
89
- const el = await fixture<PrimaryNav>(
90
- component({
91
- baseHost: 'archive.org',
92
- username: 'testuser',
93
- screenName: 'testuser',
94
- searchSlotMode: 'custom',
95
- }),
96
- );
97
-
98
- expect(el.shadowRoot?.querySelector('nav-search')).to.not.exist;
99
- expect(el.shadowRoot?.querySelector('.custom-search-container')).to.exist;
100
-
101
- const slot = el.shadowRoot?.querySelector<HTMLSlotElement>(
102
- 'slot[name="custom-search"]',
103
- );
104
- expect(slot).to.exist;
105
- });
106
-
107
- it('keeps search trigger button when searchSlotMode is "custom"', async () => {
108
- const el = await fixture<PrimaryNav>(
109
- component({
110
- baseHost: 'archive.org',
111
- username: 'testuser',
112
- screenName: 'testuser',
113
- searchSlotMode: 'custom',
114
- }),
115
- );
116
-
117
- expect(el.shadowRoot?.querySelector('.search-trigger')).to.exist;
118
- });
119
-
120
- it('hides custom search when hideSearch is true', async () => {
121
- const el = await fixture<PrimaryNav>(
122
- component({
123
- baseHost: 'archive.org',
124
- username: 'testuser',
125
- screenName: 'testuser',
126
- searchSlotMode: 'custom',
127
- hideSearch: true,
128
- }),
129
- );
130
-
131
- expect(el.shadowRoot?.querySelector('.custom-search-container')).to.not
132
- .exist;
133
- expect(el.shadowRoot?.querySelector('.search-trigger')).to.not.exist;
134
- });
135
-
136
- it('opens a slot with `secondIdentitySlotMode`', async () => {
137
- const el = await fixture<PrimaryNav>(
138
- component({
139
- baseHost: 'archive.org',
140
- username: 'boop',
141
- screenName: 'somesuperlongscreenname',
142
- secondIdentitySlotMode: 'allow',
143
- }),
144
- );
145
-
146
- const brandingBlock = el.shadowRoot?.querySelector('div.branding');
147
- expect(brandingBlock?.getAttribute('class')).to.contain(
148
- 'branding second-logo',
149
- );
150
-
151
- const slot = brandingBlock?.querySelector('slot');
152
- expect(slot).to.exist;
153
- expect(slot?.getAttribute('name')).to.equal('opt-sec-logo');
154
-
155
- el.secondIdentitySlotMode = '';
156
- await elementUpdated(el);
157
- const noSlotBrandingBlock = el.shadowRoot?.querySelector('div.branding');
158
- expect(noSlotBrandingBlock?.getAttribute('class')).to.contain('branding');
159
-
160
- const noSlot = noSlotBrandingBlock?.querySelector('slot');
161
- expect(noSlot).to.not.exist;
162
- });
163
- });
1
+ import {
2
+ html,
3
+ fixture,
4
+ expect,
5
+ fixtureCleanup,
6
+ elementUpdated,
7
+ } from '@open-wc/testing';
8
+
9
+ import '../src/primary-nav';
10
+ import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from '../src/models';
11
+ import { PrimaryNav } from '../src/primary-nav';
12
+
13
+ const component = ({
14
+ baseHost = 'archive.org',
15
+ username = '',
16
+ screenName = '',
17
+ hideSearch = false,
18
+ config = {},
19
+ secondIdentitySlotMode = 'allow',
20
+ }: {
21
+ baseHost?: string;
22
+ username?: string;
23
+ screenName?: string;
24
+ hideSearch?: boolean;
25
+ config?: IATopNavConfig;
26
+ secondIdentitySlotMode?: IATopNavSecondIdentitySlotMode;
27
+ }) =>
28
+ html` <primary-nav
29
+ .baseHost=${baseHost}
30
+ .username=${username}
31
+ .screenName=${screenName}
32
+ ?hideSearch=${hideSearch}
33
+ .config=${config}
34
+ .secondIdentitySlotMode=${secondIdentitySlotMode}
35
+ ></primary-nav>`;
36
+
37
+ afterEach(() => {
38
+ fixtureCleanup();
39
+ });
40
+
41
+ describe('<primary-nav>', () => {
42
+ it('renders the login link when no username present', async () => {
43
+ const el = await fixture<PrimaryNav>(
44
+ component({
45
+ baseHost: 'archive.org',
46
+ username: '',
47
+ }),
48
+ );
49
+
50
+ expect(el.shadowRoot?.querySelector('login-button')).to.not.be.undefined;
51
+ });
52
+
53
+ it('does not render search trigger or search slot if hideSearch true', async () => {
54
+ const el = await fixture<PrimaryNav>(
55
+ component({
56
+ baseHost: 'archive.org',
57
+ username: 'shaneriley',
58
+ screenName: 'shaneriley',
59
+ hideSearch: true,
60
+ }),
61
+ );
62
+
63
+ expect(el.shadowRoot?.querySelector('.search-trigger')).to.equal(null);
64
+ expect(el.shadowRoot?.querySelector('.custom-search-container')).to.not
65
+ .exist;
66
+ });
67
+
68
+ it('renders custom-search slot container', async () => {
69
+ const el = await fixture<PrimaryNav>(
70
+ component({
71
+ baseHost: 'archive.org',
72
+ username: 'testuser',
73
+ screenName: 'testuser',
74
+ }),
75
+ );
76
+
77
+ expect(el.shadowRoot?.querySelector('.custom-search-container')).to.exist;
78
+
79
+ const slot = el.shadowRoot?.querySelector<HTMLSlotElement>(
80
+ 'slot[name="custom-search"]',
81
+ );
82
+ expect(slot).to.exist;
83
+ });
84
+
85
+ it('renders search trigger button for mobile toggle', async () => {
86
+ const el = await fixture<PrimaryNav>(
87
+ component({
88
+ baseHost: 'archive.org',
89
+ username: 'testuser',
90
+ screenName: 'testuser',
91
+ }),
92
+ );
93
+
94
+ expect(el.shadowRoot?.querySelector('.search-trigger')).to.exist;
95
+ });
96
+
97
+ it('does not render nav-search', async () => {
98
+ const el = await fixture<PrimaryNav>(
99
+ component({
100
+ baseHost: 'archive.org',
101
+ username: 'testuser',
102
+ screenName: 'testuser',
103
+ }),
104
+ );
105
+
106
+ expect(el.shadowRoot?.querySelector('nav-search')).to.not.exist;
107
+ });
108
+
109
+ it('opens a slot with `secondIdentitySlotMode`', async () => {
110
+ const el = await fixture<PrimaryNav>(
111
+ component({
112
+ baseHost: 'archive.org',
113
+ username: 'boop',
114
+ screenName: 'somesuperlongscreenname',
115
+ secondIdentitySlotMode: 'allow',
116
+ }),
117
+ );
118
+
119
+ const brandingBlock = el.shadowRoot?.querySelector('div.branding');
120
+ expect(brandingBlock?.getAttribute('class')).to.contain(
121
+ 'branding second-logo',
122
+ );
123
+
124
+ const slot = brandingBlock?.querySelector('slot');
125
+ expect(slot).to.exist;
126
+ expect(slot?.getAttribute('name')).to.equal('opt-sec-logo');
127
+
128
+ el.secondIdentitySlotMode = '';
129
+ await elementUpdated(el);
130
+ const noSlotBrandingBlock = el.shadowRoot?.querySelector('div.branding');
131
+ expect(noSlotBrandingBlock?.getAttribute('class')).to.contain('branding');
132
+
133
+ const noSlot = noSlotBrandingBlock?.querySelector('slot');
134
+ expect(noSlot).to.not.exist;
135
+ });
136
+ });