| 1 | import test from 'tape';
|
|---|
| 2 |
|
|---|
| 3 | import mayHaveAccessibleLabel from '../../../src/util/mayHaveAccessibleLabel';
|
|---|
| 4 | import JSXAttributeMock from '../../../__mocks__/JSXAttributeMock';
|
|---|
| 5 | import JSXElementMock from '../../../__mocks__/JSXElementMock';
|
|---|
| 6 | import JSXExpressionContainerMock from '../../../__mocks__/JSXExpressionContainerMock';
|
|---|
| 7 | import JSXSpreadAttributeMock from '../../../__mocks__/JSXSpreadAttributeMock';
|
|---|
| 8 | import JSXTextMock from '../../../__mocks__/JSXTextMock';
|
|---|
| 9 | import LiteralMock from '../../../__mocks__/LiteralMock';
|
|---|
| 10 |
|
|---|
| 11 | test('mayHaveAccessibleLabel', (t) => {
|
|---|
| 12 | t.equal(
|
|---|
| 13 | mayHaveAccessibleLabel(
|
|---|
| 14 | JSXElementMock('div', [], [
|
|---|
| 15 | JSXElementMock('div', [], [
|
|---|
| 16 | JSXElementMock('span', [], []),
|
|---|
| 17 | JSXElementMock('span', [], [
|
|---|
| 18 | JSXElementMock('span', [], []),
|
|---|
| 19 | JSXElementMock('span', [], [
|
|---|
| 20 | JSXElementMock('span', [], []),
|
|---|
| 21 | ]),
|
|---|
| 22 | ]),
|
|---|
| 23 | ]),
|
|---|
| 24 | JSXElementMock('span', [], []),
|
|---|
| 25 | JSXElementMock('img', [
|
|---|
| 26 | JSXAttributeMock('src', 'some/path'),
|
|---|
| 27 | ]),
|
|---|
| 28 | ]),
|
|---|
| 29 | 5,
|
|---|
| 30 | ),
|
|---|
| 31 | false,
|
|---|
| 32 | 'no label returns false',
|
|---|
| 33 | );
|
|---|
| 34 |
|
|---|
| 35 | t.test('label via attributes', (st) => {
|
|---|
| 36 | st.equal(
|
|---|
| 37 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 38 | JSXAttributeMock('aria-label', 'A delicate label'),
|
|---|
| 39 | ], [])),
|
|---|
| 40 | true,
|
|---|
| 41 | 'aria-label returns true',
|
|---|
| 42 | );
|
|---|
| 43 |
|
|---|
| 44 | st.equal(
|
|---|
| 45 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 46 | JSXAttributeMock('aria-label', ''),
|
|---|
| 47 | ], [])),
|
|---|
| 48 | false,
|
|---|
| 49 | 'aria-label without content returns false',
|
|---|
| 50 | );
|
|---|
| 51 |
|
|---|
| 52 | st.equal(
|
|---|
| 53 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 54 | JSXAttributeMock('aria-label', ' '),
|
|---|
| 55 | ], [])),
|
|---|
| 56 | false,
|
|---|
| 57 | 'aria-label with only spaces whitespace, should return false',
|
|---|
| 58 | );
|
|---|
| 59 | st.equal(
|
|---|
| 60 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 61 | JSXAttributeMock('aria-label', '\n'),
|
|---|
| 62 | ], [])),
|
|---|
| 63 | false,
|
|---|
| 64 | 'aria-label with only newline whitespace, should return false',
|
|---|
| 65 | );
|
|---|
| 66 |
|
|---|
| 67 | st.equal(
|
|---|
| 68 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 69 | JSXAttributeMock('aria-labelledby', 'elementId'),
|
|---|
| 70 | ], [])),
|
|---|
| 71 | true,
|
|---|
| 72 | 'aria-labelledby returns true',
|
|---|
| 73 | );
|
|---|
| 74 |
|
|---|
| 75 | st.equal(
|
|---|
| 76 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 77 | JSXAttributeMock('aria-labelledby', ''),
|
|---|
| 78 | ], [])),
|
|---|
| 79 | false,
|
|---|
| 80 | 'aria-labelledby without content returns false',
|
|---|
| 81 | );
|
|---|
| 82 |
|
|---|
| 83 | st.equal(
|
|---|
| 84 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 85 | JSXAttributeMock('aria-labelledby', 'elementId', true),
|
|---|
| 86 | ], [])),
|
|---|
| 87 | true,
|
|---|
| 88 | 'aria-labelledby with an expression container, should return true',
|
|---|
| 89 | );
|
|---|
| 90 |
|
|---|
| 91 | st.end();
|
|---|
| 92 | });
|
|---|
| 93 |
|
|---|
| 94 | t.test('label via custom label attribute', (st) => {
|
|---|
| 95 | const customLabelProp = 'cowbell';
|
|---|
| 96 |
|
|---|
| 97 | st.equal(
|
|---|
| 98 | mayHaveAccessibleLabel(
|
|---|
| 99 | JSXElementMock('div', [
|
|---|
| 100 | JSXAttributeMock(customLabelProp, 'A delicate label'),
|
|---|
| 101 | ], []),
|
|---|
| 102 | 1,
|
|---|
| 103 | [customLabelProp],
|
|---|
| 104 | ),
|
|---|
| 105 | true,
|
|---|
| 106 | 'aria-label returns true',
|
|---|
| 107 | );
|
|---|
| 108 |
|
|---|
| 109 | st.end();
|
|---|
| 110 | });
|
|---|
| 111 |
|
|---|
| 112 | t.test('text label', (st) => {
|
|---|
| 113 | st.equal(
|
|---|
| 114 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 115 | LiteralMock('A fancy label'),
|
|---|
| 116 | ])),
|
|---|
| 117 | true,
|
|---|
| 118 | 'Literal text, returns true',
|
|---|
| 119 | );
|
|---|
| 120 |
|
|---|
| 121 | st.equal(
|
|---|
| 122 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 123 | LiteralMock(' '),
|
|---|
| 124 | ])),
|
|---|
| 125 | false,
|
|---|
| 126 | 'Literal spaces whitespace, returns false',
|
|---|
| 127 | );
|
|---|
| 128 |
|
|---|
| 129 | st.equal(
|
|---|
| 130 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 131 | LiteralMock('\n'),
|
|---|
| 132 | ])),
|
|---|
| 133 | false,
|
|---|
| 134 | 'Literal newline whitespace, returns false',
|
|---|
| 135 | );
|
|---|
| 136 |
|
|---|
| 137 | st.equal(
|
|---|
| 138 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 139 | JSXTextMock('A fancy label'),
|
|---|
| 140 | ])),
|
|---|
| 141 | true,
|
|---|
| 142 | 'JSXText, returns true',
|
|---|
| 143 | );
|
|---|
| 144 |
|
|---|
| 145 | st.equal(
|
|---|
| 146 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 147 | JSXElementMock('div', [], [
|
|---|
| 148 | JSXTextMock('A fancy label'),
|
|---|
| 149 | ]),
|
|---|
| 150 | ])),
|
|---|
| 151 | false,
|
|---|
| 152 | 'label is outside of default depth, returns false',
|
|---|
| 153 | );
|
|---|
| 154 |
|
|---|
| 155 | st.equal(
|
|---|
| 156 | mayHaveAccessibleLabel(
|
|---|
| 157 | JSXElementMock('div', [], [
|
|---|
| 158 | JSXElementMock('div', [], [
|
|---|
| 159 | JSXTextMock('A fancy label'),
|
|---|
| 160 | ]),
|
|---|
| 161 | ]),
|
|---|
| 162 | 2,
|
|---|
| 163 | ),
|
|---|
| 164 | true,
|
|---|
| 165 | 'label is inside of custom depth, returns true',
|
|---|
| 166 | );
|
|---|
| 167 |
|
|---|
| 168 | st.equal(
|
|---|
| 169 | mayHaveAccessibleLabel(
|
|---|
| 170 | JSXElementMock('div', [], [
|
|---|
| 171 | JSXElementMock('div', [], [
|
|---|
| 172 | JSXElementMock('span', [], []),
|
|---|
| 173 | JSXElementMock('span', [], [
|
|---|
| 174 | JSXElementMock('span', [], []),
|
|---|
| 175 | JSXElementMock('span', [], [
|
|---|
| 176 | JSXElementMock('span', [], [
|
|---|
| 177 | JSXElementMock('span', [], [
|
|---|
| 178 | JSXTextMock('A fancy label'),
|
|---|
| 179 | ]),
|
|---|
| 180 | ]),
|
|---|
| 181 | ]),
|
|---|
| 182 | ]),
|
|---|
| 183 | ]),
|
|---|
| 184 | JSXElementMock('span', [], []),
|
|---|
| 185 | JSXElementMock('img', [
|
|---|
| 186 | JSXAttributeMock('src', 'some/path'),
|
|---|
| 187 | ]),
|
|---|
| 188 | ]),
|
|---|
| 189 | 6,
|
|---|
| 190 | ),
|
|---|
| 191 | true,
|
|---|
| 192 | 'deep nesting, returns true',
|
|---|
| 193 | );
|
|---|
| 194 |
|
|---|
| 195 | st.end();
|
|---|
| 196 | });
|
|---|
| 197 |
|
|---|
| 198 | t.test('image content', (st) => {
|
|---|
| 199 | st.equal(
|
|---|
| 200 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 201 | JSXElementMock('img', [
|
|---|
| 202 | JSXAttributeMock('src', 'some/path'),
|
|---|
| 203 | ]),
|
|---|
| 204 | ])),
|
|---|
| 205 | false,
|
|---|
| 206 | 'without alt, returns true',
|
|---|
| 207 | );
|
|---|
| 208 |
|
|---|
| 209 | st.equal(
|
|---|
| 210 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 211 | JSXElementMock('img', [
|
|---|
| 212 | JSXAttributeMock('src', 'some/path'),
|
|---|
| 213 | JSXAttributeMock('alt', 'A sensible label'),
|
|---|
| 214 | ]),
|
|---|
| 215 | ])),
|
|---|
| 216 | true,
|
|---|
| 217 | 'with alt, returns true',
|
|---|
| 218 | );
|
|---|
| 219 |
|
|---|
| 220 | st.equal(
|
|---|
| 221 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 222 | JSXElementMock('img', [
|
|---|
| 223 | JSXAttributeMock('src', 'some/path'),
|
|---|
| 224 | JSXAttributeMock('aria-label', 'A sensible label'),
|
|---|
| 225 | ]),
|
|---|
| 226 | ])),
|
|---|
| 227 | true,
|
|---|
| 228 | 'with aria-label, returns true',
|
|---|
| 229 | );
|
|---|
| 230 |
|
|---|
| 231 | st.end();
|
|---|
| 232 | });
|
|---|
| 233 |
|
|---|
| 234 | t.test('Intederminate situations', (st) => {
|
|---|
| 235 | st.equal(
|
|---|
| 236 | mayHaveAccessibleLabel(JSXElementMock('div', [], [
|
|---|
| 237 | JSXExpressionContainerMock('mysteryBox'),
|
|---|
| 238 | ])),
|
|---|
| 239 | true,
|
|---|
| 240 | 'expression container children, returns true',
|
|---|
| 241 | );
|
|---|
| 242 |
|
|---|
| 243 | st.equal(
|
|---|
| 244 | mayHaveAccessibleLabel(JSXElementMock('div', [
|
|---|
| 245 | JSXAttributeMock('style', 'some-junk'),
|
|---|
| 246 | JSXSpreadAttributeMock('props'),
|
|---|
| 247 | ], [])),
|
|---|
| 248 | true,
|
|---|
| 249 | 'spread operator in attributes, returns true',
|
|---|
| 250 | );
|
|---|
| 251 |
|
|---|
| 252 | st.end();
|
|---|
| 253 | });
|
|---|
| 254 |
|
|---|
| 255 | t.end();
|
|---|
| 256 | });
|
|---|
