Преглед на файлове

Display current editor mode in manual test.

Maciej Gołaszewski преди 6 години
родител
ревизия
265c711c87

+ 22 - 2
packages/ckeditor5-restricted-editing/tests/manual/restrictedediting.html

@@ -1,8 +1,10 @@
 <p>
-	<button id="mode-standard">Standard mode</button>
-	<button id="mode-restricted">Restricted mode</button>
+	<button id="mode-standard">Switch to standard mode</button>
+	<button id="mode-restricted">Switch to restricted mode</button>
 </p>
 
+<p id="current-mode"></p>
+
 <div id="editor">
 	<h2>Heading 1</h2>
 	<p>Paragraph <span class="ck-restricted-editing-exception">it is editable</span></p>
@@ -33,4 +35,22 @@
 	.ck-restricted-editing-exception {
 		background-color: #ffcd96;
 	}
+
+	#current-mode {
+		/*text-align: center;*/
+		padding: 1em 0;
+	}
+
+	.mode {
+		color: #fff;
+		padding: 0.5em;
+	}
+
+	.mode-standard {
+		background: #4f4fff;
+	}
+
+	.mode-restricted {
+		background: #a72727;
+	}
 </style>

+ 3 - 0
packages/ckeditor5-restricted-editing/tests/manual/restrictedediting.js

@@ -14,6 +14,7 @@ import RestrictedEditing from '../../src/restrictedediting';
 
 const restrictedModeButton = document.getElementById( 'mode-restricted' );
 const standardModeButton = document.getElementById( 'mode-standard' );
+const currentModeDisplay = document.getElementById( 'current-mode' );
 
 enableSwitchToStandardMode();
 enableSwitchToRestrictedMode();
@@ -51,6 +52,7 @@ async function startStandardMode() {
 		}
 	} );
 
+	currentModeDisplay.innerHTML = 'Current Mode: <span class="mode mode-standard">STANDARD</span>';
 	enableSwitchToRestrictedMode();
 }
 
@@ -63,6 +65,7 @@ async function startRestrictedMode() {
 		toolbar: [ 'bold', 'italic', 'link', '|', 'restrictedEditing', '|', 'undo', 'redo' ]
 	} );
 
+	currentModeDisplay.innerHTML = 'Current Mode: <span class="mode mode-restricted">RESTRICTED</span>';
 	enableSwitchToStandardMode();
 }