mui-language-picker
Version:
Material UI language picker
380 lines (379 loc) • 16.9 kB
JavaScript
;
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
/* eslint-disable @typescript-eslint/no-empty-function */
/* eslint-disable @typescript-eslint/no-unused-vars */
var react_1 = __importDefault(require("react"));
var react_2 = require("@testing-library/react");
var LanguageChoice_1 = __importDefault(require("../LanguageChoice"));
var model_1 = require("../model");
// eslint-disable-next-line no-var
var mockLangTags = [
{
full: 'de-Latn-DE',
name: 'German, Standard',
region: 'DE',
regionname: 'Germany',
script: 'Latn',
sldr: true,
tag: 'de',
},
{
full: 'en-Latn-US',
name: 'English',
region: 'US',
regionname: 'United States',
script: 'Latn',
sldr: true,
tag: 'en',
},
{
full: 'fr-Latn-FR',
name: 'French',
region: 'FR',
regionname: 'France',
script: 'Latn',
sldr: true,
tag: 'fr',
},
{
full: 'seh-Latn-MZ',
name: 'Sena',
region: 'MZ',
regionname: 'Mozambique',
script: 'Latn',
sldr: true,
tag: 'seh',
},
];
describe('LanguageChoice', function () {
beforeEach(react_2.cleanup);
it('should render', function () {
var props = {
list: [],
choose: function (tag) { },
t: {},
};
var container = (0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props))).container;
expect(container).not.toBe(null);
});
it('should render with secondary', function () {
var props = {
list: [],
choose: function (tag) { },
t: {},
secondary: true,
};
var container = (0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props))).container;
expect(container).not.toBe(null);
});
it('should render with displayName', function () {
var props = {
list: [],
choose: function (tag) { },
t: {},
displayName: function (curName, tag) { return ''; },
};
var container = (0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props))).container;
expect(container).not.toBe(null);
});
it('should render with displayName and secondary', function () {
var props = {
list: [],
choose: function (tag) { },
t: {},
displayName: function (curName, tag) { return ''; },
secondary: true,
};
var container = (0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props))).container;
expect(container).not.toBe(null);
});
it('should render with displayName and secondary and langTags', function () {
var props = {
list: [],
choose: function (tag) { },
t: {},
displayName: function (curName, tag) { return ''; },
secondary: true,
};
var container = (0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props))).container;
expect(container).not.toBe(null);
});
it('should render with displayName and secondary and langTags and scriptName', function () {
var props = {
list: [],
choose: function (tag) { },
t: {},
displayName: function (curName, tag) { return ''; },
secondary: true,
};
var container = (0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props))).container;
expect(container).not.toBe(null);
});
it('should render language codes, names, and regions', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
displayName: function (curName, tag) { return curName; },
secondary: true,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText('de')).toHaveLength(1);
expect(react_2.screen.getAllByText('en')).toHaveLength(1);
expect(react_2.screen.getAllByText('fr')).toHaveLength(1);
expect(react_2.screen.getAllByText('seh')).toHaveLength(1);
expect(react_2.screen.getAllByText('German, Standard')).toHaveLength(1);
expect(react_2.screen.getAllByText('English')).toHaveLength(1);
expect(react_2.screen.getAllByText('French')).toHaveLength(1);
expect(react_2.screen.getAllByText('Sena')).toHaveLength(1);
expect(react_2.screen.getAllByText('A Language of Germany.')).toHaveLength(1);
expect(react_2.screen.getAllByText('A Language of United States.')).toHaveLength(1);
expect(react_2.screen.getAllByText('A Language of France.')).toHaveLength(1);
expect(react_2.screen.getAllByText('A Language of Mozambique.')).toHaveLength(1);
});
it('should render without displayName', function () {
var props = {
list: [1].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText('English')).toHaveLength(1);
});
it('should render with custom displayName', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
displayName: function (curName) { return curName.slice(0, 4); },
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText('Engl')).toHaveLength(1);
});
it('should not render regions when secondary is false', function () {
var props = {
list: [1, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
displayName: function (curName, tag) { return curName; },
secondary: false,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.queryAllByText('de')).toHaveLength(0);
expect(react_2.screen.getAllByText('en')).toHaveLength(1);
expect(react_2.screen.queryAllByText('fr')).toHaveLength(0);
expect(react_2.screen.getAllByText('seh')).toHaveLength(1);
expect(react_2.screen.queryAllByText('German, Standard')).toHaveLength(0);
expect(react_2.screen.getAllByText('English')).toHaveLength(1);
expect(react_2.screen.queryAllByText('French')).toHaveLength(0);
expect(react_2.screen.getAllByText('Sena')).toHaveLength(1);
expect(react_2.screen.queryAllByText('A Language of Germany.')).toHaveLength(0);
expect(react_2.screen.queryAllByText('A Language of United States.')).toHaveLength(0);
expect(react_2.screen.queryAllByText('A Language of France.')).toHaveLength(0);
expect(react_2.screen.queryAllByText('A Language of Mozambique.')).toHaveLength(0);
});
it('should render local name (when present) with name', function () {
var props = {
list: [
{
full: 'agu-Latn-GT',
localname: "Qa'yol",
name: 'Awakateko',
region: 'GT',
regionname: 'Guatemala',
script: 'Latn',
sldr: true,
tag: 'agu',
},
],
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText("Qa'yol / Awakateko")).toHaveLength(1);
});
it('should fall back to localnames if localname not present', function () {
var props = {
list: [
{
full: 'crh-Cyrl-UA',
localnames: ['Къырымтатар тили', 'Къырымтатарджа', 'къырым тили'],
name: 'Crimean Tatar',
region: 'UA',
regionname: 'Ukraine',
script: 'Cyrl',
sldr: false,
tag: 'crh',
},
],
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText('Къырымтатар тили / Crimean Tatar')).toHaveLength(1);
});
it('should render script when present', function () {
var props = {
list: [0, 4]
.map(function (i) { return mockLangTags[i]; })
.concat([
{
full: 'de-Brai-DE',
name: 'German, Standard',
nophonvars: true,
region: 'DE',
regionname: 'Germany',
script: 'Brai',
sldr: false,
tag: 'de-Brai',
},
]),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
displayName: function (curName, tag) { return curName; },
secondary: true,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText('de')).toHaveLength(1);
expect(react_2.screen.getAllByText('de-Brai')).toHaveLength(1);
expect(react_2.screen.getAllByText('German, Standard')).toHaveLength(2);
expect(react_2.screen.getAllByText('A Language of Germany.')).toHaveLength(1);
expect(react_2.screen.getAllByText('A Language of Germany in the Braille script.')).toHaveLength(1);
});
it('should render alternate names when present', function () {
var props = {
list: [0, 4]
.map(function (i) { return mockLangTags[i]; })
.concat([
{
full: 'de-Brai-DE',
iana: ['German'],
iso639_3: 'deu',
name: 'German, Standard',
names: ['Alemán', 'Allemand', 'Deutsch'],
nophonvars: true,
region: 'DE',
regionname: 'Germany',
script: 'Brai',
sldr: false,
tag: 'de-Brai',
windows: 'de-Brai-DE',
},
]),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
displayName: function (curName, tag) { return curName; },
secondary: true,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText('de')).toHaveLength(1);
expect(react_2.screen.getAllByText('de-Brai')).toHaveLength(1);
expect(react_2.screen.getAllByText('German, Standard')).toHaveLength(2);
expect(react_2.screen.getAllByText('A Language of Germany.')).toHaveLength(1);
expect(react_2.screen.getAllByText('A Language of Germany in the Braille script.')).toHaveLength(1);
expect(react_2.screen.getAllByText('Alemán, Allemand, Deutsch')).toHaveLength(1);
});
it('should also consider alternate localnames without duplicates', function () {
var props = {
list: [
{
full: 'ago-Latn-PG',
localnames: ['Anka Panide', 'Tainae'],
name: 'Tainae',
names: ['Anka Panide', 'Ivori'],
region: 'PG',
regionname: 'Papua New Guinea',
script: 'Latn',
sldr: true,
tag: 'ago',
},
],
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
secondary: true,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
expect(react_2.screen.getAllByText('Anka Panide, Ivori, Tainae')).toHaveLength(1);
});
it('should choose when clicked', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
react_2.fireEvent.click(react_2.screen.getByText('English'));
expect(props.choose).toHaveBeenCalled();
expect(props.choose).toHaveBeenCalledWith(mockLangTags[1]);
});
it('should choose on keydown with space', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
react_2.fireEvent.keyDown(react_2.screen.getByText('English'), { keyCode: 32 });
expect(props.choose).toHaveBeenCalled();
expect(props.choose).toHaveBeenCalledWith(mockLangTags[1]);
});
it('should choose on keydown with enter', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
react_2.fireEvent.keyDown(react_2.screen.getByText('English'), { keyCode: 13 });
expect(props.choose).toHaveBeenCalled();
expect(props.choose).toHaveBeenCalledWith(mockLangTags[1]);
});
it('should not choose on keydown is not space or enter', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
react_2.fireEvent.keyDown(react_2.screen.getByText('English'), { keyCode: 97 });
expect(props.choose).not.toHaveBeenCalled();
});
it('should choose when clicked without secondary info', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
displayName: function (curName) { return curName; },
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
react_2.fireEvent.click(react_2.screen.getByText('English'));
expect(props.choose).toHaveBeenCalled();
expect(props.choose).toHaveBeenCalledWith(mockLangTags[1]);
});
it('should render with custom displayName choose when clicked', function () {
var props = {
list: [0, 1, 2, 3].map(function (i) { return mockLangTags[i]; }),
choose: jest.fn(),
t: model_1.languagePickerStrings_en,
displayName: function (curName) { return curName.slice(0, 4); },
};
(0, react_2.render)(react_1.default.createElement(LanguageChoice_1.default, __assign({}, props)));
react_2.fireEvent.click(react_2.screen.getByText('Engl'));
expect(props.choose).toHaveBeenCalled();
expect(props.choose).toHaveBeenCalledWith(mockLangTags[1]);
});
});