demo tests

xtermjs · Oct 4, 2024 · 956c7cb · 956c7cb
1 parent 23bef99
commit 956c7cb
Show file tree

Hide file tree

Showing 8 changed files with 31 additions and 117 deletions.
diff --git a/addons/addon-web-fonts/typings/addon-web-fonts.d.ts b/addons/addon-web-fonts/typings/addon-web-fonts.d.ts
@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2017 The xterm.js authors. All rights reserved.
+ * Copyright (c) 2024 The xterm.js authors. All rights reserved.
  * @license MIT
  */
 
@@ -13,7 +13,7 @@ declare module '@xterm/addon-web-fonts' {
    */
   export class WebFontsAddon implements ITerminalAddon {
     /**
-     * @param forceInitialRelayout Force an initial relayout, if a webfont was found.
+     * @param forceInitialRelayout Force initial relayout, if a webfont was found (default true).
      */
     constructor(forceInitialRelayout?: boolean);
     public activate(terminal: Terminal): void;

diff --git a/addons/addon-web-fonts/webpack.config.js b/addons/addon-web-fonts/webpack.config.js
@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019 The xterm.js authors. All rights reserved.
+ * Copyright (c) 2024 The xterm.js authors. All rights reserved.
  * @license MIT
  */
 

diff --git a/demo/bpdots.regular.otf b/demo/bpdots.regular.otf
diff --git a/demo/client.ts b/demo/client.ts
@@ -23,7 +23,7 @@ import { FitAddon } from '@xterm/addon-fit';
 import { LigaturesAddon } from '@xterm/addon-ligatures';
 import { SearchAddon, ISearchOptions } from '@xterm/addon-search';
 import { SerializeAddon } from '@xterm/addon-serialize';
-import { WebFontsAddon } from '@xterm/addon-web-fonts';
+import { WebFontsAddon, loadFonts } from '@xterm/addon-web-fonts';
 import { WebLinksAddon } from '@xterm/addon-web-links';
 import { WebglAddon } from '@xterm/addon-webgl';
 import { Unicode11Addon } from '@xterm/addon-unicode11';
@@ -252,6 +252,7 @@ if (document.location.pathname === '/test') {
   addVtButtons();
   initImageAddonExposed();
   testEvents();
+  testWebfonts();
 }
 
 function createTerminal(): void {
@@ -268,7 +269,7 @@ function createTerminal(): void {
       backend: 'conpty',
       buildNumber: 22621
     } : undefined,
-    fontFamily: '"Roboto Mono", "Fira Code", courier-new, courier, monospace, "Powerline Extra Symbols"',
+    fontFamily: '"Fira Code", courier-new, courier, monospace, "Powerline Extra Symbols"',
     theme: xtermjsTheme
   } as ITerminalOptions);
 
@@ -1427,3 +1428,21 @@ function testEvents(): void {
   document.getElementById('event-focus').addEventListener('click', ()=> term.focus());
   document.getElementById('event-blur').addEventListener('click', ()=> term.blur());
 }
+
+function testWebfonts() {
+  document.getElementById('webfont-kongtime').addEventListener('click', async () => {
+    const ff = new FontFace('Kongtext', "url(/kongtext.regular.ttf) format('truetype')");
+    await loadFonts([ff]);
+    term.options.fontFamily = 'Kongtext';
+    term.options.lineHeight = 1.3;
+    addons.fit.instance?.fit();
+  });
+  document.getElementById('webfont-bpdots').addEventListener('click', async () => {
+    document.styleSheets[0].insertRule("@font-face { font-family: 'BPdots'; src: url(/bpdots.regular.otf) format('opentype'); weight: 400 }", 0);
+    await loadFonts(['BPdots']);
+    term.options.fontFamily = 'BPdots';
+    term.options.lineHeight = 1.3;
+    term.options.fontSize = 20;
+    addons.fit.instance?.fit();
+  });
+}
diff --git a/demo/index.html b/demo/index.html
@@ -116,6 +116,10 @@ <h3>Test</h3>
               <dt>Events Test</dt>
               <dd><button id="event-focus">focus</button></dd>
               <dd><button id="event-blur">blur</button></dd>
+
+              <dt>Webfonts</dt>
+              <dd><button id="webfont-kongtime">Kongtext (JS)</button></dd>
+              <dd><button id="webfont-bpdots">BPdots (CSS)</button></dd>
             </dl>
           </div>
         </div>

diff --git a/demo/kongtext.regular.ttf b/demo/kongtext.regular.ttf
diff --git a/demo/server.js b/demo/server.js
@@ -39,6 +39,9 @@ function startServer() {
     res.sendFile(__dirname + '/style.css');
   });
 
+  app.get('/kongtext.regular.ttf', (req, res) => res.sendFile(__dirname + '/kongtext.regular.ttf'));
+  app.get('/bpdots.regular.otf', (req, res) => res.sendFile(__dirname + '/bpdots.regular.otf'));
+
   app.use('/dist', express.static(__dirname + '/dist'));
   app.use('/src', express.static(__dirname + '/src'));
 

diff --git a/demo/style.css b/demo/style.css
@@ -1,115 +1,3 @@
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: italic;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x7DF4xlVMF-BfR8bXMIjhOm3CWWoKC.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-/* cyrillic */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: italic;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x7DF4xlVMF-BfR8bXMIjhOm3mWWoKC.woff2) format('woff2');
-  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-/* greek */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: italic;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x7DF4xlVMF-BfR8bXMIjhOm36WWoKC.woff2) format('woff2');
-  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
-}
-/* vietnamese */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: italic;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x7DF4xlVMF-BfR8bXMIjhOm3KWWoKC.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: italic;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x7DF4xlVMF-BfR8bXMIjhOm3OWWoKC.woff2) format('woff2');
-  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: italic;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x7DF4xlVMF-BfR8bXMIjhOm32WWg.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* cyrillic-ext */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: normal;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x5DF4xlVMF-BfR8bXMIjhGq3-OXg.woff2) format('woff2');
-  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
-}
-/* cyrillic */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: normal;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x5DF4xlVMF-BfR8bXMIjhPq3-OXg.woff2) format('woff2');
-  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
-}
-/* greek */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: normal;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x5DF4xlVMF-BfR8bXMIjhIq3-OXg.woff2) format('woff2');
-  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
-}
-/* vietnamese */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: normal;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x5DF4xlVMF-BfR8bXMIjhEq3-OXg.woff2) format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: normal;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x5DF4xlVMF-BfR8bXMIjhFq3-OXg.woff2) format('woff2');
-  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Roboto Mono';
-  font-style: normal;
-  font-weight: 100 700;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/robotomono/v23/L0x5DF4xlVMF-BfR8bXMIjhLq38.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-
-
-
 body {
     font-family: helvetica, sans-serif, arial;
     font-size: 1em;