@dhis2-ui/button 9.5.0-alpha.1 → 9.5.0

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 (52) hide show
  1. package/build/cjs/button/__tests__/Button.test.js +0 -31
  2. package/build/cjs/button/button.js +0 -8
  3. package/build/cjs/button/features/can_be_blurred/index.js +4 -4
  4. package/build/cjs/button/features/can_be_clicked/index.js +4 -4
  5. package/build/cjs/button/features/can_be_focused/index.js +4 -4
  6. package/build/cjs/button-strip/features/accepts_children/index.js +3 -3
  7. package/build/cjs/dropdown-button/features/accepts_children/index.js +3 -3
  8. package/build/cjs/dropdown-button/features/accepts_component/index.js +3 -3
  9. package/build/cjs/dropdown-button/features/accepts_icon/index.js +3 -3
  10. package/build/cjs/dropdown-button/features/accepts_initial_focus/index.js +3 -3
  11. package/build/cjs/dropdown-button/features/button_is_clickable/index.js +3 -5
  12. package/build/cjs/dropdown-button/features/can_be_disabled/index.js +3 -8
  13. package/build/cjs/dropdown-button/features/common/index.js +2 -2
  14. package/build/cjs/dropdown-button/features/opens_a_dropdown/index.js +6 -8
  15. package/build/cjs/split-button/features/accepts_children/index.js +3 -3
  16. package/build/cjs/split-button/features/accepts_icon/index.js +5 -5
  17. package/build/cjs/split-button/features/accepts_initial_focus/index.js +3 -3
  18. package/build/cjs/split-button/features/arrow_opens_menu/index.js +9 -11
  19. package/build/cjs/split-button/features/button_is_clickable/index.js +3 -5
  20. package/build/cjs/split-button/features/can_be_disabled/index.js +6 -6
  21. package/build/cjs/split-button/features/common/index.js +3 -3
  22. package/build/cjs/split-button/split-button.js +4 -30
  23. package/build/es/button/__tests__/Button.test.js +0 -31
  24. package/build/es/button/button.js +0 -8
  25. package/build/es/button/features/can_be_blurred/index.js +1 -1
  26. package/build/es/button/features/can_be_clicked/index.js +1 -1
  27. package/build/es/button/features/can_be_focused/index.js +1 -1
  28. package/build/es/button-strip/features/accepts_children/index.js +1 -1
  29. package/build/es/dropdown-button/features/accepts_children/index.js +1 -1
  30. package/build/es/dropdown-button/features/accepts_component/index.js +1 -1
  31. package/build/es/dropdown-button/features/accepts_icon/index.js +1 -1
  32. package/build/es/dropdown-button/features/accepts_initial_focus/index.js +1 -1
  33. package/build/es/dropdown-button/features/button_is_clickable/index.js +1 -2
  34. package/build/es/dropdown-button/features/can_be_disabled/index.js +1 -6
  35. package/build/es/dropdown-button/features/common/index.js +1 -1
  36. package/build/es/dropdown-button/features/opens_a_dropdown/index.js +1 -2
  37. package/build/es/split-button/features/accepts_children/index.js +1 -1
  38. package/build/es/split-button/features/accepts_icon/index.js +3 -3
  39. package/build/es/split-button/features/accepts_initial_focus/index.js +1 -1
  40. package/build/es/split-button/features/arrow_opens_menu/index.js +1 -2
  41. package/build/es/split-button/features/button_is_clickable/index.js +1 -2
  42. package/build/es/split-button/features/can_be_disabled/index.js +1 -1
  43. package/build/es/split-button/features/common/index.js +1 -1
  44. package/build/es/split-button/split-button.js +4 -29
  45. package/package.json +6 -6
  46. package/types/index.d.ts +4 -1
  47. package/build/cjs/locales/en/translations.json +0 -3
  48. package/build/cjs/locales/index.js +0 -27
  49. package/build/cjs/split-button/split-button.test.js +0 -99
  50. package/build/es/locales/en/translations.json +0 -3
  51. package/build/es/locales/index.js +0 -13
  52. package/build/es/split-button/split-button.test.js +0 -77
@@ -11,37 +11,6 @@ var _button = require("../button.js");
11
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
12
 
13
13
  describe('<Button>', () => {
14
- let consoleSpy;
15
- beforeEach(() => {
16
- consoleSpy = jest.spyOn(console, 'debug').mockImplementation();
17
- });
18
- afterEach(() => {
19
- consoleSpy.mockRestore();
20
- });
21
- describe('warning for missing aria-label and title', () => {
22
- it('No warning if children exist but aria-label and title is missing', () => {
23
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, null, "Children content"));
24
- expect(consoleSpy).not.toHaveBeenCalled();
25
- });
26
- it('does not warn if aria-label and title is present', () => {
27
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
28
- "aria-label": "Test",
29
- title: "Test"
30
- }, "Children content"));
31
- expect(consoleSpy).not.toHaveBeenCalled();
32
- });
33
- it('warns if no children are present with no arial-label and title', () => {
34
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, null));
35
- expect(consoleSpy).toHaveBeenCalledWith('Button component has no children but is missing title and ariaLabel attribute.');
36
- });
37
- it('No warning if there are no children but arial label and title', () => {
38
- (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
39
- "aria-label": "Test",
40
- title: "Test"
41
- }));
42
- expect(consoleSpy).not.toHaveBeenCalled();
43
- });
44
- });
45
14
  it('renders a default data-test attribute', () => {
46
15
  const dataTest = 'dhis2-uicore-button';
47
16
  const wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react2.default.createElement(_button.Button, {
@@ -58,14 +58,6 @@ const Button = _ref => {
58
58
  ref.current.focus();
59
59
  }
60
60
  }, [initialFocus, ref.current]);
61
- const {
62
- 'aria-label': ariaLabel,
63
- title
64
- } = otherProps;
65
-
66
- if (!children && !title && !ariaLabel) {
67
- console.debug('Button component has no children but is missing title and ariaLabel attribute.');
68
- }
69
61
 
70
62
  const handleClick = event => onClick && onClick({
71
63
  value,
@@ -1,15 +1,15 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('an Button with initialFocus and onBlur handler is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('an Button with initialFocus and onBlur handler is rendered', () => {
6
6
  cy.visitStory('Button', 'With initialFocus and onBlur');
7
7
  cy.focused().should('exist');
8
8
  });
9
- (0, _steps.When)('the Button is blurred', () => {
9
+ (0, _cypressCucumberPreprocessor.When)('the Button is blurred', () => {
10
10
  cy.get('[data-test="dhis2-uicore-button"]').blur();
11
11
  });
12
- (0, _steps.Then)('the onBlur handler is called', () => {
12
+ (0, _cypressCucumberPreprocessor.Then)('the onBlur handler is called', () => {
13
13
  cy.window().should(win => {
14
14
  expect(win.onBlur).to.be.calledWith({
15
15
  value: 'default',
@@ -1,14 +1,14 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a Button with onClick handler is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a Button with onClick handler is rendered', () => {
6
6
  cy.visitStory('Button', 'With onClick');
7
7
  });
8
- (0, _steps.When)('the Button is clicked', () => {
8
+ (0, _cypressCucumberPreprocessor.When)('the Button is clicked', () => {
9
9
  cy.get('[data-test="dhis2-uicore-button"]').click();
10
10
  });
11
- (0, _steps.Then)('the onClick handler is called', () => {
11
+ (0, _cypressCucumberPreprocessor.Then)('the onClick handler is called', () => {
12
12
  cy.window().should(win => {
13
13
  expect(win.onClick).to.be.calledWith({
14
14
  name: 'Button',
@@ -1,14 +1,14 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a Button with onFocus handler is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a Button with onFocus handler is rendered', () => {
6
6
  cy.visitStory('Button', 'With onFocus');
7
7
  });
8
- (0, _steps.When)('the Button is focused', () => {
8
+ (0, _cypressCucumberPreprocessor.When)('the Button is focused', () => {
9
9
  cy.get('[data-test="dhis2-uicore-button"]').focus();
10
10
  });
11
- (0, _steps.Then)('the onFocus handler is called', () => {
11
+ (0, _cypressCucumberPreprocessor.Then)('the onFocus handler is called', () => {
12
12
  cy.window().should(win => {
13
13
  expect(win.onFocus).to.be.calledWith({
14
14
  value: 'default',
@@ -1,11 +1,11 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a ButtonStrip with children is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a ButtonStrip with children is rendered', () => {
6
6
  cy.visitStory('ButtonStrip', 'With children');
7
7
  cy.get('[data-test="dhis2-uicore-buttonstrip"]').should('be.visible');
8
8
  });
9
- (0, _steps.Then)('the children are visible', () => {
9
+ (0, _cypressCucumberPreprocessor.Then)('the children are visible', () => {
10
10
  cy.contains('I am a child').should('be.visible');
11
11
  });
@@ -1,11 +1,11 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a DropdownButton with children is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a DropdownButton with children is rendered', () => {
6
6
  cy.visitStory('DropdownButton', 'With children');
7
7
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').should('be.visible');
8
8
  });
9
- (0, _steps.Then)('the children are visible', () => {
9
+ (0, _cypressCucumberPreprocessor.Then)('the children are visible', () => {
10
10
  cy.contains('I am a child').should('be.visible');
11
11
  });
@@ -1,13 +1,13 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a DropdownButton with a component prop and opened dropdown is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a DropdownButton with a component prop and opened dropdown is rendered', () => {
6
6
  cy.visitStory('DropdownButton', 'With component');
7
7
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').should('be.visible');
8
8
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').click();
9
9
  cy.get('[data-test="dhis2-uicore-dropdownbutton-popper"]').should('exist');
10
10
  });
11
- (0, _steps.Then)('the component is visible', () => {
11
+ (0, _cypressCucumberPreprocessor.Then)('the component is visible', () => {
12
12
  cy.contains('I am a component').should('be.visible');
13
13
  });
@@ -1,11 +1,11 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a DropdownButton with an icon prop is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a DropdownButton with an icon prop is rendered', () => {
6
6
  cy.visitStory('DropdownButton', 'With icon');
7
7
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').should('be.visible');
8
8
  });
9
- (0, _steps.Then)('the icon is visible', () => {
9
+ (0, _cypressCucumberPreprocessor.Then)('the icon is visible', () => {
10
10
  cy.contains('Icon').should('be.visible');
11
11
  });
@@ -1,10 +1,10 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a DropdownButton with initialFocus is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a DropdownButton with initialFocus is rendered', () => {
6
6
  cy.visitStory('DropdownButton', 'With initialFocus');
7
7
  });
8
- (0, _steps.Then)('the DropdownButton is focused', () => {
8
+ (0, _cypressCucumberPreprocessor.Then)('the DropdownButton is focused', () => {
9
9
  cy.focused().parent('[data-test="dhis2-uicore-dropdownbutton"]').should('exist');
10
10
  });
@@ -1,13 +1,11 @@
1
1
  "use strict";
2
2
 
3
- require("../common/index.js");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- var _steps = require("cypress-cucumber-preprocessor/steps");
6
-
7
- (0, _steps.Given)('a DropdownButton with onClick handler is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a DropdownButton with onClick handler is rendered', () => {
8
6
  cy.visitStory('DropdownButton', 'With onClick');
9
7
  });
10
- (0, _steps.Then)('the onClick handler is called', () => {
8
+ (0, _cypressCucumberPreprocessor.Then)('the onClick handler is called', () => {
11
9
  cy.window().should(win => {
12
10
  expect(win.onClick).to.be.calledWith({
13
11
  name: 'Button',
@@ -1,16 +1,11 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a disabled DropdownButton with onClick handler is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a disabled DropdownButton with onClick handler is rendered', () => {
6
6
  cy.visitStory('DropdownButton', 'Disabled with onClick');
7
7
  });
8
- (0, _steps.When)('the DropdownButton is clicked', () => {
9
- cy.get('[data-test="dhis2-uicore-dropdownbutton"] button').click({
10
- force: true
11
- });
12
- });
13
- (0, _steps.Then)('the onClick handler is not called', () => {
8
+ (0, _cypressCucumberPreprocessor.Then)('the onClick handler is not called', () => {
14
9
  cy.window().should(win => {
15
10
  expect(win.onClick).not.to.be.called;
16
11
  });
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.When)('the DropdownButton is clicked', () => {
5
+ (0, _cypressCucumberPreprocessor.When)('the DropdownButton is clicked', () => {
6
6
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').click();
7
7
  });
@@ -1,23 +1,21 @@
1
1
  "use strict";
2
2
 
3
- require("../common/index.js");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- var _steps = require("cypress-cucumber-preprocessor/steps");
6
-
7
- (0, _steps.Given)('a default DropdownButton is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a default DropdownButton is rendered', () => {
8
6
  cy.visitStory('DropdownButton', 'Default');
9
7
  });
10
- (0, _steps.Given)('a DropdownButton with opened dropdown is rendered', () => {
8
+ (0, _cypressCucumberPreprocessor.Given)('a DropdownButton with opened dropdown is rendered', () => {
11
9
  cy.visitStory('DropdownButton', 'Default');
12
10
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').click();
13
11
  cy.get('[data-test="dhis2-uicore-dropdownbutton-popper"]').should('exist');
14
12
  });
15
- (0, _steps.When)('the user clicks the backdrop Layer', () => {
13
+ (0, _cypressCucumberPreprocessor.When)('the user clicks the backdrop Layer', () => {
16
14
  cy.get('[data-test="dhis2-uicore-layer"]').click();
17
15
  });
18
- (0, _steps.Then)('the dropdown is not rendered', () => {
16
+ (0, _cypressCucumberPreprocessor.Then)('the dropdown is not rendered', () => {
19
17
  cy.get('[data-test="dhis2-uicore-dropdownbutton-popper"]').should('not.exist');
20
18
  });
21
- (0, _steps.Then)('the dropdown is rendered', () => {
19
+ (0, _cypressCucumberPreprocessor.Then)('the dropdown is rendered', () => {
22
20
  cy.get('[data-test="dhis2-uicore-dropdownbutton-popper"]').should('exist');
23
21
  });
@@ -1,11 +1,11 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a SplitButton with children is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a SplitButton with children is rendered', () => {
6
6
  cy.visitStory('SplitButton', 'With children');
7
7
  cy.get('[data-test="dhis2-uicore-splitbutton"]').should('be.visible');
8
8
  });
9
- (0, _steps.Then)('the children are visible', () => {
9
+ (0, _cypressCucumberPreprocessor.Then)('the children are visible', () => {
10
10
  cy.get('[data-test="dhis2-uicore-splitbutton-button"]').contains('I am a child').should('be.visible');
11
11
  });
@@ -1,12 +1,12 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a SplitButton with an icon is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a SplitButton with an icon is rendered', () => {
6
6
  cy.visitStory('SplitButton', 'With icon');
7
7
  cy.get('[data-test="dhis2-uicore-splitbutton"]').should('be.visible');
8
8
  });
9
- (0, _steps.Then)('the icon is visible on the left button only', () => {
10
- cy.get('[data-test="dhis2-uicore-splitbutton-button"]').contains('Icon').should('be.visible');
11
- cy.get('[data-test="dhis2-uicore-splitbutton-toggle"]').contains('Icon').should('not.exist');
9
+ (0, _cypressCucumberPreprocessor.Then)('the icon is visible on the left button only', () => {
10
+ cy.get('[data-test="dhis2-uicore-splitbutton-button"] :contains("Icon")').should('be.visible');
11
+ cy.get('[data-test="dhis2-uicore-splitbutton-toggle"] :contains("Icon")').should('not.exist');
12
12
  });
@@ -1,10 +1,10 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a SplitButton with initialFocus is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a SplitButton with initialFocus is rendered', () => {
6
6
  cy.visitStory('SplitButton', 'With initialFocus');
7
7
  });
8
- (0, _steps.Then)('the SplitButton button is focused', () => {
8
+ (0, _cypressCucumberPreprocessor.Then)('the SplitButton button is focused', () => {
9
9
  cy.focused().should('have.attr', 'data-test', 'dhis2-uicore-splitbutton-button');
10
10
  });
@@ -1,31 +1,29 @@
1
1
  "use strict";
2
2
 
3
- require("../common/index.js");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- var _steps = require("cypress-cucumber-preprocessor/steps");
6
-
7
- (0, _steps.Given)('a SplitButton is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a SplitButton is rendered', () => {
8
6
  cy.visitStory('SplitButton', 'Default');
9
7
  });
10
- (0, _steps.Given)('the SplitButton menu is open', () => {
8
+ (0, _cypressCucumberPreprocessor.Given)('the SplitButton menu is open', () => {
11
9
  cy.get('[data-test="dhis2-uicore-splitbutton-toggle"]').click();
12
10
  cy.get('[data-test="dhis2-uicore-splitbutton-menu"]').should('be.visible');
13
11
  });
14
- (0, _steps.Given)('the SplitButton menu is closed', () => {
12
+ (0, _cypressCucumberPreprocessor.Given)('the SplitButton menu is closed', () => {
15
13
  cy.get('[data-test="dhis2-uicore-splitbutton-menu"]').should('not.exist');
16
14
  });
17
- (0, _steps.When)('the user clicks the backdrop Layer', () => {
15
+ (0, _cypressCucumberPreprocessor.When)('the user clicks the backdrop Layer', () => {
18
16
  cy.get('[data-test="dhis2-uicore-layer"]').click();
19
17
  });
20
- (0, _steps.Then)('the menu is not visible', () => {
18
+ (0, _cypressCucumberPreprocessor.Then)('the menu is not visible', () => {
21
19
  cy.get('[data-test="dhis2-uicore-splitbutton-menu"]').should('not.exist');
22
20
  });
23
- (0, _steps.Then)('the component is not visible', () => {
21
+ (0, _cypressCucumberPreprocessor.Then)('the component is not visible', () => {
24
22
  cy.contains('Component').should('not.exist');
25
23
  });
26
- (0, _steps.Then)('the menu is visible', () => {
24
+ (0, _cypressCucumberPreprocessor.Then)('the menu is visible', () => {
27
25
  cy.get('[data-test="dhis2-uicore-splitbutton-menu"]').should('be.visible');
28
26
  });
29
- (0, _steps.Then)('the component is visible', () => {
27
+ (0, _cypressCucumberPreprocessor.Then)('the component is visible', () => {
30
28
  cy.contains('Component').should('be.visible');
31
29
  });
@@ -1,13 +1,11 @@
1
1
  "use strict";
2
2
 
3
- require("../common/index.js");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- var _steps = require("cypress-cucumber-preprocessor/steps");
6
-
7
- (0, _steps.Given)('a SplitButton with onClick hander is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a SplitButton with onClick hander is rendered', () => {
8
6
  cy.visitStory('SplitButton', 'With onClick');
9
7
  });
10
- (0, _steps.Then)('the onClick handler is called', () => {
8
+ (0, _cypressCucumberPreprocessor.Then)('the onClick handler is called', () => {
11
9
  cy.window().its('onClick').should('be.calledWith', {
12
10
  name: 'Button',
13
11
  value: 'default',
@@ -1,23 +1,23 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.Given)('a disabled SplitButton is rendered', () => {
5
+ (0, _cypressCucumberPreprocessor.Given)('a disabled SplitButton is rendered', () => {
6
6
  cy.visitStory('SplitButton', 'With disabled');
7
7
  });
8
- (0, _steps.When)('the user clicks the SplitButton Button', () => {
8
+ (0, _cypressCucumberPreprocessor.When)('the user clicks the SplitButton Button', () => {
9
9
  cy.get('[data-test="dhis2-uicore-splitbutton-button"]').click({
10
10
  force: true
11
11
  });
12
12
  });
13
- (0, _steps.Then)('the SplitButton Button is not focused', () => {
13
+ (0, _cypressCucumberPreprocessor.Then)('the SplitButton Button is not focused', () => {
14
14
  cy.focused().should('not.exist');
15
15
  });
16
- (0, _steps.When)('the user clicks the SplitButton Toggle', () => {
16
+ (0, _cypressCucumberPreprocessor.When)('the user clicks the SplitButton Toggle', () => {
17
17
  cy.get('[data-test="dhis2-uicore-splitbutton-toggle"]').click({
18
18
  force: true
19
19
  });
20
20
  });
21
- (0, _steps.Then)('the SplitButton Toggle is not focused', () => {
21
+ (0, _cypressCucumberPreprocessor.Then)('the SplitButton Toggle is not focused', () => {
22
22
  cy.focused().should('not.exist');
23
23
  });
@@ -1,10 +1,10 @@
1
1
  "use strict";
2
2
 
3
- var _steps = require("cypress-cucumber-preprocessor/steps");
3
+ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
4
4
 
5
- (0, _steps.When)('the SplitButton is clicked', () => {
5
+ (0, _cypressCucumberPreprocessor.When)('the SplitButton is clicked', () => {
6
6
  cy.get('[data-test="dhis2-uicore-splitbutton-button"]').click();
7
7
  });
8
- (0, _steps.When)('the SplitButton toggle is clicked', () => {
8
+ (0, _cypressCucumberPreprocessor.When)('the SplitButton toggle is clicked', () => {
9
9
  cy.get('[data-test="dhis2-uicore-splitbutton-toggle"]').click();
10
10
  });
@@ -23,8 +23,6 @@ var _react = _interopRequireWildcard(require("react"));
23
23
 
24
24
  var _index = require("../index.js");
25
25
 
26
- var _index2 = _interopRequireDefault(require("../locales/index.js"));
27
-
28
26
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
29
27
 
30
28
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -50,18 +48,6 @@ class SplitButton extends _react.Component {
50
48
 
51
49
  _defineProperty(this, "anchorRef", /*#__PURE__*/_react.default.createRef());
52
50
 
53
- _defineProperty(this, "handleKeyDown", event => {
54
- event.preventDefault();
55
-
56
- if (event.key === 'Escape' && this.state.open) {
57
- event.stopPropagation();
58
- this.setState({
59
- open: false
60
- });
61
- this.anchorRef.current && this.anchorRef.current.focus();
62
- }
63
- });
64
-
65
51
  _defineProperty(this, "onClick", (payload, event) => {
66
52
  if (this.props.onClick) {
67
53
  this.props.onClick({
@@ -72,19 +58,9 @@ class SplitButton extends _react.Component {
72
58
  }
73
59
  });
74
60
 
75
- _defineProperty(this, "onToggle", () => {
76
- this.setState(prevState => ({
77
- open: !prevState.open
78
- }));
79
- });
80
- }
81
-
82
- componentDidMount() {
83
- document.addEventListener('keydown', this.handleKeyDown);
84
- }
85
-
86
- componentWillUnmount() {
87
- document.removeEventListener('keydown', this.handleKeyDown);
61
+ _defineProperty(this, "onToggle", () => this.setState({
62
+ open: !this.state.open
63
+ }));
88
64
  }
89
65
 
90
66
  render() {
@@ -143,9 +119,7 @@ class SplitButton extends _react.Component {
143
119
  type: type,
144
120
  tabIndex: tabIndex,
145
121
  className: (0, _classnames.default)(className, rightButton.className),
146
- dataTest: "".concat(dataTest, "-toggle"),
147
- title: _index2.default.t('Toggle dropdown'),
148
- "aria-label": _index2.default.t('Toggle dropdown')
122
+ dataTest: "".concat(dataTest, "-toggle")
149
123
  }, arrow), open && /*#__PURE__*/_react.default.createElement(_layer.Layer, {
150
124
  onBackdropClick: this.onToggle,
151
125
  transparent: true
@@ -3,37 +3,6 @@ import { mount } from 'enzyme';
3
3
  import React from 'react';
4
4
  import { Button } from '../button.js';
5
5
  describe('<Button>', () => {
6
- let consoleSpy;
7
- beforeEach(() => {
8
- consoleSpy = jest.spyOn(console, 'debug').mockImplementation();
9
- });
10
- afterEach(() => {
11
- consoleSpy.mockRestore();
12
- });
13
- describe('warning for missing aria-label and title', () => {
14
- it('No warning if children exist but aria-label and title is missing', () => {
15
- render( /*#__PURE__*/React.createElement(Button, null, "Children content"));
16
- expect(consoleSpy).not.toHaveBeenCalled();
17
- });
18
- it('does not warn if aria-label and title is present', () => {
19
- render( /*#__PURE__*/React.createElement(Button, {
20
- "aria-label": "Test",
21
- title: "Test"
22
- }, "Children content"));
23
- expect(consoleSpy).not.toHaveBeenCalled();
24
- });
25
- it('warns if no children are present with no arial-label and title', () => {
26
- render( /*#__PURE__*/React.createElement(Button, null));
27
- expect(consoleSpy).toHaveBeenCalledWith('Button component has no children but is missing title and ariaLabel attribute.');
28
- });
29
- it('No warning if there are no children but arial label and title', () => {
30
- render( /*#__PURE__*/React.createElement(Button, {
31
- "aria-label": "Test",
32
- title: "Test"
33
- }));
34
- expect(consoleSpy).not.toHaveBeenCalled();
35
- });
36
- });
37
6
  it('renders a default data-test attribute', () => {
38
7
  const dataTest = 'dhis2-uicore-button';
39
8
  const wrapper = mount( /*#__PURE__*/React.createElement(Button, {
@@ -39,14 +39,6 @@ export const Button = _ref => {
39
39
  ref.current.focus();
40
40
  }
41
41
  }, [initialFocus, ref.current]);
42
- const {
43
- 'aria-label': ariaLabel,
44
- title
45
- } = otherProps;
46
-
47
- if (!children && !title && !ariaLabel) {
48
- console.debug('Button component has no children but is missing title and ariaLabel attribute.');
49
- }
50
42
 
51
43
  const handleClick = event => onClick && onClick({
52
44
  value,
@@ -1,4 +1,4 @@
1
- import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, When, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('an Button with initialFocus and onBlur handler is rendered', () => {
3
3
  cy.visitStory('Button', 'With initialFocus and onBlur');
4
4
  cy.focused().should('exist');
@@ -1,4 +1,4 @@
1
- import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, When, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a Button with onClick handler is rendered', () => {
3
3
  cy.visitStory('Button', 'With onClick');
4
4
  });
@@ -1,4 +1,4 @@
1
- import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, When, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a Button with onFocus handler is rendered', () => {
3
3
  cy.visitStory('Button', 'With onFocus');
4
4
  });
@@ -1,4 +1,4 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a ButtonStrip with children is rendered', () => {
3
3
  cy.visitStory('ButtonStrip', 'With children');
4
4
  cy.get('[data-test="dhis2-uicore-buttonstrip"]').should('be.visible');
@@ -1,4 +1,4 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a DropdownButton with children is rendered', () => {
3
3
  cy.visitStory('DropdownButton', 'With children');
4
4
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').should('be.visible');
@@ -1,4 +1,4 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a DropdownButton with a component prop and opened dropdown is rendered', () => {
3
3
  cy.visitStory('DropdownButton', 'With component');
4
4
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').should('be.visible');
@@ -1,4 +1,4 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a DropdownButton with an icon prop is rendered', () => {
3
3
  cy.visitStory('DropdownButton', 'With icon');
4
4
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').should('be.visible');
@@ -1,4 +1,4 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a DropdownButton with initialFocus is rendered', () => {
3
3
  cy.visitStory('DropdownButton', 'With initialFocus');
4
4
  });
@@ -1,5 +1,4 @@
1
- import '../common/index.js';
2
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
3
2
  Given('a DropdownButton with onClick handler is rendered', () => {
4
3
  cy.visitStory('DropdownButton', 'With onClick');
5
4
  });
@@ -1,12 +1,7 @@
1
- import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a disabled DropdownButton with onClick handler is rendered', () => {
3
3
  cy.visitStory('DropdownButton', 'Disabled with onClick');
4
4
  });
5
- When('the DropdownButton is clicked', () => {
6
- cy.get('[data-test="dhis2-uicore-dropdownbutton"] button').click({
7
- force: true
8
- });
9
- });
10
5
  Then('the onClick handler is not called', () => {
11
6
  cy.window().should(win => {
12
7
  expect(win.onClick).not.to.be.called;
@@ -1,4 +1,4 @@
1
- import { When } from 'cypress-cucumber-preprocessor/steps';
1
+ import { When } from '@badeball/cypress-cucumber-preprocessor';
2
2
  When('the DropdownButton is clicked', () => {
3
3
  cy.get('[data-test="dhis2-uicore-dropdownbutton"]').click();
4
4
  });
@@ -1,5 +1,4 @@
1
- import '../common/index.js';
2
- import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, When, Then } from '@badeball/cypress-cucumber-preprocessor';
3
2
  Given('a default DropdownButton is rendered', () => {
4
3
  cy.visitStory('DropdownButton', 'Default');
5
4
  });
@@ -1,4 +1,4 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a SplitButton with children is rendered', () => {
3
3
  cy.visitStory('SplitButton', 'With children');
4
4
  cy.get('[data-test="dhis2-uicore-splitbutton"]').should('be.visible');
@@ -1,9 +1,9 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a SplitButton with an icon is rendered', () => {
3
3
  cy.visitStory('SplitButton', 'With icon');
4
4
  cy.get('[data-test="dhis2-uicore-splitbutton"]').should('be.visible');
5
5
  });
6
6
  Then('the icon is visible on the left button only', () => {
7
- cy.get('[data-test="dhis2-uicore-splitbutton-button"]').contains('Icon').should('be.visible');
8
- cy.get('[data-test="dhis2-uicore-splitbutton-toggle"]').contains('Icon').should('not.exist');
7
+ cy.get('[data-test="dhis2-uicore-splitbutton-button"] :contains("Icon")').should('be.visible');
8
+ cy.get('[data-test="dhis2-uicore-splitbutton-toggle"] :contains("Icon")').should('not.exist');
9
9
  });
@@ -1,4 +1,4 @@
1
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a SplitButton with initialFocus is rendered', () => {
3
3
  cy.visitStory('SplitButton', 'With initialFocus');
4
4
  });
@@ -1,5 +1,4 @@
1
- import '../common/index.js';
2
- import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, When, Then } from '@badeball/cypress-cucumber-preprocessor';
3
2
  Given('a SplitButton is rendered', () => {
4
3
  cy.visitStory('SplitButton', 'Default');
5
4
  });
@@ -1,5 +1,4 @@
1
- import '../common/index.js';
2
- import { Given, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, Then } from '@badeball/cypress-cucumber-preprocessor';
3
2
  Given('a SplitButton with onClick hander is rendered', () => {
4
3
  cy.visitStory('SplitButton', 'With onClick');
5
4
  });
@@ -1,4 +1,4 @@
1
- import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps';
1
+ import { Given, When, Then } from '@badeball/cypress-cucumber-preprocessor';
2
2
  Given('a disabled SplitButton is rendered', () => {
3
3
  cy.visitStory('SplitButton', 'With disabled');
4
4
  });
@@ -1,4 +1,4 @@
1
- import { When } from 'cypress-cucumber-preprocessor/steps';
1
+ import { When } from '@badeball/cypress-cucumber-preprocessor';
2
2
  When('the SplitButton is clicked', () => {
3
3
  cy.get('[data-test="dhis2-uicore-splitbutton-button"]').click();
4
4
  });
@@ -10,7 +10,6 @@ import cx from 'classnames';
10
10
  import PropTypes from 'prop-types';
11
11
  import React, { Component } from 'react';
12
12
  import { Button } from '../index.js';
13
- import i18n from '../locales/index.js';
14
13
  const rightButton = {
15
14
  styles: /*#__PURE__*/React.createElement(_JSXStyle, {
16
15
  id: "2502148942"
@@ -28,18 +27,6 @@ class SplitButton extends Component {
28
27
 
29
28
  _defineProperty(this, "anchorRef", /*#__PURE__*/React.createRef());
30
29
 
31
- _defineProperty(this, "handleKeyDown", event => {
32
- event.preventDefault();
33
-
34
- if (event.key === 'Escape' && this.state.open) {
35
- event.stopPropagation();
36
- this.setState({
37
- open: false
38
- });
39
- this.anchorRef.current && this.anchorRef.current.focus();
40
- }
41
- });
42
-
43
30
  _defineProperty(this, "onClick", (payload, event) => {
44
31
  if (this.props.onClick) {
45
32
  this.props.onClick({
@@ -50,19 +37,9 @@ class SplitButton extends Component {
50
37
  }
51
38
  });
52
39
 
53
- _defineProperty(this, "onToggle", () => {
54
- this.setState(prevState => ({
55
- open: !prevState.open
56
- }));
57
- });
58
- }
59
-
60
- componentDidMount() {
61
- document.addEventListener('keydown', this.handleKeyDown);
62
- }
63
-
64
- componentWillUnmount() {
65
- document.removeEventListener('keydown', this.handleKeyDown);
40
+ _defineProperty(this, "onToggle", () => this.setState({
41
+ open: !this.state.open
42
+ }));
66
43
  }
67
44
 
68
45
  render() {
@@ -121,9 +98,7 @@ class SplitButton extends Component {
121
98
  type: type,
122
99
  tabIndex: tabIndex,
123
100
  className: cx(className, rightButton.className),
124
- dataTest: "".concat(dataTest, "-toggle"),
125
- title: i18n.t('Toggle dropdown'),
126
- "aria-label": i18n.t('Toggle dropdown')
101
+ dataTest: "".concat(dataTest, "-toggle")
127
102
  }, arrow), open && /*#__PURE__*/React.createElement(Layer, {
128
103
  onBackdropClick: this.onToggle,
129
104
  transparent: true
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/button",
3
- "version": "9.5.0-alpha.1",
3
+ "version": "9.5.0",
4
4
  "description": "UI Button",
5
5
  "repository": {
6
6
  "type": "git",
@@ -33,11 +33,11 @@
33
33
  },
34
34
  "dependencies": {
35
35
  "@dhis2/prop-types": "^3.1.2",
36
- "@dhis2-ui/layer": "9.5.0-alpha.1",
37
- "@dhis2-ui/loader": "9.5.0-alpha.1",
38
- "@dhis2-ui/popper": "9.5.0-alpha.1",
39
- "@dhis2/ui-constants": "9.5.0-alpha.1",
40
- "@dhis2/ui-icons": "9.5.0-alpha.1",
36
+ "@dhis2-ui/layer": "9.5.0",
37
+ "@dhis2-ui/loader": "9.5.0",
38
+ "@dhis2-ui/popper": "9.5.0",
39
+ "@dhis2/ui-constants": "9.5.0",
40
+ "@dhis2/ui-icons": "9.5.0",
41
41
  "classnames": "^2.3.1",
42
42
  "prop-types": "^15.7.2"
43
43
  },
package/types/index.d.ts CHANGED
@@ -16,7 +16,7 @@ type ButtonOpenEventHandler<
16
16
  Event extends React.SyntheticEvent = React.MouseEvent<HTMLButtonElement>
17
17
  > = (arg0: ButtonEventPayload & { open: boolean }, event: Event) => void
18
18
 
19
- export interface ButtonProps extends HTMLButtonElement {
19
+ export interface BaseButtonProps {
20
20
  /**
21
21
  * Component to render inside the button
22
22
  */
@@ -102,6 +102,9 @@ export interface ButtonProps extends HTMLButtonElement {
102
102
  onKeyDown?: ButtonEventHandler<React.KeyboardEvent<HTMLButtonElement>>
103
103
  }
104
104
 
105
+ export type ButtonProps = BaseButtonProps &
106
+ Omit<React.ComponentPropsWithoutRef<'button'>, keyof BaseButtonProps>
107
+
105
108
  export const Button: React.FC<ButtonProps>
106
109
 
107
110
  export interface ButtonStripProps {
@@ -1,3 +0,0 @@
1
- {
2
- "Toggle dropdown": "Toggle dropdown"
3
- }
@@ -1,27 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
-
8
- var _d2I18n = _interopRequireDefault(require("@dhis2/d2-i18n"));
9
-
10
- var _translations = _interopRequireDefault(require("./en/translations.json"));
11
-
12
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
-
14
- //------------------------------------------------------------------------------
15
- // <auto-generated>
16
- // This code was generated by d2-i18n-generate.
17
- //
18
- // Changes to this file may cause incorrect behavior and will be lost if
19
- // the code is regenerated.
20
- // </auto-generated>
21
- //------------------------------------------------------------------------------
22
- const namespace = 'default';
23
-
24
- _d2I18n.default.addResources('en', namespace, _translations.default);
25
-
26
- var _default = _d2I18n.default;
27
- exports.default = _default;
@@ -1,99 +0,0 @@
1
- "use strict";
2
-
3
- var _react = require("@testing-library/react");
4
-
5
- var _react2 = _interopRequireDefault(require("react"));
6
-
7
- require("@testing-library/jest-dom/extend-expect");
8
-
9
- var _splitButton = require("./split-button.js");
10
-
11
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
-
13
- describe('SplitButton', () => {
14
- afterEach(_react.cleanup);
15
- it('renders button with children', () => {
16
- const {
17
- getByText
18
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null, "Click me"));
19
- expect(getByText('Click me')).toBeInTheDocument();
20
- });
21
- it('toggles dropdown when left button is clicked', () => {
22
- const {
23
- getByTestId,
24
- queryByTestId
25
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null));
26
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
27
-
28
- _react.fireEvent.click(toggleButton);
29
-
30
- expect(queryByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
31
-
32
- _react.fireEvent.click(toggleButton);
33
-
34
- expect(queryByTestId('dhis2-uicore-splitbutton-menu')).not.toBeInTheDocument();
35
- });
36
- it('renders dropdown content when open is true', () => {
37
- const {
38
- getByTestId
39
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
40
- component: /*#__PURE__*/_react2.default.createElement("div", null, "Dropdown Content")
41
- }));
42
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
43
-
44
- _react.fireEvent.click(toggleButton);
45
-
46
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
47
- });
48
- it("does not close dropdown 'Enter' key is pressed", async () => {
49
- const {
50
- getByTestId
51
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
52
- component: /*#__PURE__*/_react2.default.createElement("div", null, "Dropdown Content")
53
- }));
54
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
55
-
56
- _react.fireEvent.click(toggleButton);
57
-
58
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
59
-
60
- _react.fireEvent.keyDown(document, {
61
- key: 'Enter'
62
- }); // Use waitFor to wait for the DOM to update
63
-
64
-
65
- await (0, _react.waitFor)(() => {
66
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
67
- });
68
- });
69
- it('closes dropdown when escape key is pressed', async () => {
70
- const {
71
- getByTestId,
72
- queryByTestId
73
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, {
74
- component: /*#__PURE__*/_react2.default.createElement("div", null, "Dropdown Content")
75
- }));
76
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
77
-
78
- _react.fireEvent.click(toggleButton);
79
-
80
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
81
-
82
- _react.fireEvent.keyDown(document, {
83
- key: 'Escape'
84
- }); // Use waitFor to wait for the DOM to update
85
-
86
-
87
- await (0, _react.waitFor)(() => {
88
- expect(queryByTestId('dhis2-uicore-splitbutton-menu')).not.toBeInTheDocument();
89
- });
90
- });
91
- it('adds title and aria-label attributes to the right button', () => {
92
- const {
93
- getByTestId
94
- } = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_splitButton.SplitButton, null));
95
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
96
- expect(toggleButton).toHaveAttribute('title', 'Toggle dropdown');
97
- expect(toggleButton).toHaveAttribute('aria-label', 'Toggle dropdown');
98
- });
99
- });
@@ -1,3 +0,0 @@
1
- {
2
- "Toggle dropdown": "Toggle dropdown"
3
- }
@@ -1,13 +0,0 @@
1
- //------------------------------------------------------------------------------
2
- // <auto-generated>
3
- // This code was generated by d2-i18n-generate.
4
- //
5
- // Changes to this file may cause incorrect behavior and will be lost if
6
- // the code is regenerated.
7
- // </auto-generated>
8
- //------------------------------------------------------------------------------
9
- import i18n from '@dhis2/d2-i18n';
10
- import enTranslations from './en/translations.json';
11
- const namespace = 'default';
12
- i18n.addResources('en', namespace, enTranslations);
13
- export default i18n;
@@ -1,77 +0,0 @@
1
- import { render, fireEvent, cleanup, waitFor } from '@testing-library/react';
2
- import React from 'react';
3
- import '@testing-library/jest-dom/extend-expect';
4
- import { SplitButton } from './split-button.js';
5
- describe('SplitButton', () => {
6
- afterEach(cleanup);
7
- it('renders button with children', () => {
8
- const {
9
- getByText
10
- } = render( /*#__PURE__*/React.createElement(SplitButton, null, "Click me"));
11
- expect(getByText('Click me')).toBeInTheDocument();
12
- });
13
- it('toggles dropdown when left button is clicked', () => {
14
- const {
15
- getByTestId,
16
- queryByTestId
17
- } = render( /*#__PURE__*/React.createElement(SplitButton, null));
18
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
19
- fireEvent.click(toggleButton);
20
- expect(queryByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
21
- fireEvent.click(toggleButton);
22
- expect(queryByTestId('dhis2-uicore-splitbutton-menu')).not.toBeInTheDocument();
23
- });
24
- it('renders dropdown content when open is true', () => {
25
- const {
26
- getByTestId
27
- } = render( /*#__PURE__*/React.createElement(SplitButton, {
28
- component: /*#__PURE__*/React.createElement("div", null, "Dropdown Content")
29
- }));
30
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
31
- fireEvent.click(toggleButton);
32
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
33
- });
34
- it("does not close dropdown 'Enter' key is pressed", async () => {
35
- const {
36
- getByTestId
37
- } = render( /*#__PURE__*/React.createElement(SplitButton, {
38
- component: /*#__PURE__*/React.createElement("div", null, "Dropdown Content")
39
- }));
40
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
41
- fireEvent.click(toggleButton);
42
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
43
- fireEvent.keyDown(document, {
44
- key: 'Enter'
45
- }); // Use waitFor to wait for the DOM to update
46
-
47
- await waitFor(() => {
48
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
49
- });
50
- });
51
- it('closes dropdown when escape key is pressed', async () => {
52
- const {
53
- getByTestId,
54
- queryByTestId
55
- } = render( /*#__PURE__*/React.createElement(SplitButton, {
56
- component: /*#__PURE__*/React.createElement("div", null, "Dropdown Content")
57
- }));
58
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
59
- fireEvent.click(toggleButton);
60
- expect(getByTestId('dhis2-uicore-splitbutton-menu')).toBeInTheDocument();
61
- fireEvent.keyDown(document, {
62
- key: 'Escape'
63
- }); // Use waitFor to wait for the DOM to update
64
-
65
- await waitFor(() => {
66
- expect(queryByTestId('dhis2-uicore-splitbutton-menu')).not.toBeInTheDocument();
67
- });
68
- });
69
- it('adds title and aria-label attributes to the right button', () => {
70
- const {
71
- getByTestId
72
- } = render( /*#__PURE__*/React.createElement(SplitButton, null));
73
- const toggleButton = getByTestId('dhis2-uicore-splitbutton-toggle');
74
- expect(toggleButton).toHaveAttribute('title', 'Toggle dropdown');
75
- expect(toggleButton).toHaveAttribute('aria-label', 'Toggle dropdown');
76
- });
77
- });