Merge pull request #2 from donnieberg/modal-role

Make modal role='alertdialog' if it is not dismissible

Author: davidlygagnon

components/modal/__tests__/modal.browser-test.jsx

@@ -127,6 +127,27 @@ describe('SLDSModal: ', function () {
 		});
 	});
 
+	describe('Proper HTML markup', () => {
+		it('dismissible modal has role=dialog', () => {
+			const cmp = getModal({
+				isOpen: true
+			});
+			const modal = getModalNode(document.body);
+			const role = modal.getAttribute('role');
+			expect(role).to.equal('dialog');
+		});
+
+		it('non-dismissible modal has role=alertdialog', () => {
+			const cmp = getModal({
+				isOpen: true,
+				dismissible: false
+			});
+			const modal = getModalNode(document.body);
+			const role = modal.getAttribute('role');
+			expect(role).to.equal('alertdialog');
+		});
+	});
+
 	describe('Open with custom header and header className', () => {
 		let modal;
 

components/modal/index.jsx

@@ -239,7 +239,7 @@ class Modal extends React.Component {
 					'slds-modal--prompt': this.isPrompt(),
 				})}
 				onClick={this.dismissModalOnClickOutside}
-				role="dialog"
+				role={this.props.dismissible ? "dialog" : "alertdialog"}
 			>
 				<div
 					className={classNames(