Maciej Gołaszewski před 6 roky
rodič
revize
33f7c4897c

+ 5 - 2
packages/ckeditor5-mention/tests/manual/mention-asynchronous.html

@@ -2,9 +2,12 @@
 	<meta http-equiv="Content-Security-Policy" content="default-src 'none'; connect-src 'self' http://localhost:3000 https://cksource.com http://*.cke-cs.com; script-src 'self' https://cksource.com; img-src * data:; style-src 'self' 'unsafe-inline'; frame-src *" />
 </head>
 
+<p>
+	<label>Use cache: <input id="cache-control" type="checkbox"></label>
+</p>
+
 <div id="editor">
-	<p>Hello <span class="mention" data-mention="@Ted">@Ted</span>.</p>
-	<p>Hello <span class="mention" data-mention="@Ted">@Ted</span><span class="mention" data-mention="@Ted">@Ted</span>.</p>
+	<p>Hello @</p>
 
 	<figure class="image">
 		<img src="sample.jpg" />

+ 8 - 2
packages/ckeditor5-mention/tests/manual/mention-asynchronous.js

@@ -62,7 +62,11 @@ ClassicEditor
 const cache = new Map();
 
 function getFeed( text ) {
-	if ( cache.has( text ) ) {
+	const useCache = document.querySelector( '#cache-control' ).checked;
+
+	if ( useCache && cache.has( text ) ) {
+		console.log( `Loading from cache for: "${ text }".` );
+
 		return cache.get( text );
 	}
 
@@ -75,7 +79,9 @@ function getFeed( text ) {
 		.then( response => {
 			const feedItems = response.json();
 
-			cache.set( text, feedItems );
+			if ( useCache ) {
+				cache.set( text, feedItems );
+			}
 
 			return feedItems;
 		} );

+ 10 - 21
packages/ckeditor5-mention/tests/manual/mention-asynchronous.md

@@ -3,34 +3,23 @@
 
 ### Configuration
 
-The feeds:
+The feed is asynchronous list that is loaded from server (`@` marker) after random delay:
 
-1. Static list with `@` marker:
+- 80% of requests completes in 100-300ms.
+- 20% of requests completes in 600-1000ms.
 
-    - Barney
-    - Lily
-    - Marshall
-    - Robin
-    - Ted
+In order to run the server go to the `ckeditor5-mention/dev-server/` and run:
 
-2. Static list of 20 items (`#` marker)
-
-    - a01
-    - a02
-    - ...
-    - a20
+```sh
+node index.js
+```  
 
 ### Interaction
 
-You can interact with mention panel with keyboard:
-
-- Move arrows up/down to select an item.
-- Use <kbd>enter</kbd> or <kbd>tab</kbd> to insert a mention into the documentation. 
-- The <kbd>esc</kbd> should close the panel.
+Controlling the cache:
 
-Mention panel should be closed on:
-- Click outside the panel view.
-- Changing selection - like placing it in other part of text.
+- You can enable caching mechanism in `getFeed()` method - if checked it will save results and load them from cache for the same query.s
+- If cache is disable no loading nor saving will be performed. 
 
 ### Disclaimer