Highlight Testing

Test the highlight feature in this website.

Special chars: ⟶☐☑○◉⿻⨇⇜⇝⇗
External icon ⇗ vs external link.

using System.IO.Compression;

#pragma warning disable 414, 3021

// Phông chữ phù hợp cần hỗ trợ tất cả các ký tự của tiếng Việt,
// để đảm bảo khả năng hiển thị chính xác trên các hệ điều hành,
// thiết bị, cũng như trình duyệt khác nhau.

namespace MyApplication
{
  [Obsolete("Kiểm tra khả năng tương thích với tiếng Việt...")]
  class Program : IInterface
  {
    public static List<int> JustDoIt(int count)
    {
      var selected = false;
      Span<int> numbers = stackalloc int[length];
      Console.WriteLine($"Hello {Name}!");
      return new List<int>(new int[] { 1, 2, 3 })
    }
  }
}

CSS

@font-face {
  font-family: Chunkfive;
  src: url('Chunkfive.otf');
}

body,
#target,
.usertext {
  color: #f0f0f0;
  background: #600;
  font-family: Chunkfive, sans;
  --heading-1: 30px/32px Helvetica, sans-serif;
}

@import url(print.css);
@media print {
  a[href^='http']::after {
    content: attr(href);
  }
}

Typescript

class MyClass {
  public static myValue: string;
  constructor(init: string) {
    this.myValue = init;
  }
}
import fs = require("fs");
module MyModule {
  export interface MyInterface extends Other {
    myProperty: any;
  }
}
declare magicNumber number;
myArray.forEach(() => { }); // fat arrow syntax

JSON

[
  {
    "title": "apples",
    "count": [12000, 20000],
    "description": {"text": "...", "sensitive": false}
  },
  {
    "title": "oranges",
    "count": [17500, null],
    "description": {"text": "...", "sensitive": false}
  }
]

HTML

<!DOCTYPE html>
<title>Title</title>

<style>body {width: 500px;}</style>

<script type="application/javascript">
  function $init() {return true;}
</script>

<body>
  <p checked class="title" id='title'>Title</p>
  <!-- here goes the rest of the page -->
</body>

Javascript

function $initHighlight(block, cls) {
  try {
    if (cls.search(/\bno\-highlight\b/) != -1)
      return process(block, true, 0x0F) +
             ` class="${cls}"`;
  } catch (e) {
    /* handle exception */
  }
  for (var i = 0 / 2; i < classes.length; i++) {
    if (checkCondition(classes[i]) === undefined)
      console.log('undefined');
  }
}

export  $initHighlight;

Typescript (TSX)

const MyComponent = () => {
  return (
    <div>
      <ChildComponent
        data={{ name: 'Name', value: value, order: 1 }}
        onClick={handleClick} />
      <web-component>{block}</web-component>
      <p>Other data</p>
    </div>
  );
};

export default MyComponent;

Diff

*** file1.txt   2014-08-21 17:58:29.764656635 -0400
--- file2.txt   2014-08-21 17:58:50.768989841 -0400
***************
*** 1,4 ****
  apples
- oranges
  kiwis
  carrots
--- 1,4 ----
  apples
  kiwis
  carrots
+ grapefruits

LaTeX

% \require{extpfeil} % produce extensible horizontal arrows
\begin{array}{ccc} % arrange LPPs
% first row
% first LPP
\begin{array}{ll}
\max & z = c^T x \\
\text{s.t.} & A x \le b \\
& x \ge 0
\end{array}
& \xtofrom{\text{duality}} &
% second LPP
\begin{array}{ll}
\min & v = b^T y \\
\text{s.t.} & A^T y \ge c \\
& y \ge 0
\end{array} \\
({\cal PC}) & & ({\cal DC}) \\
\text{add } {\Large \downharpoonleft} \text{slack var} &  & \text{minus } {\Large \downharpoonright} \text{surplus var}\\ % Change to your favorite arrow style
%
% second row
% third LPP
\begin{array}{ll}
\max & z = c^T x \\
\text{s.t.} & A x + s = b \\
& x,s \ge 0
\end{array}
& \xtofrom[\text{some steps skipped}]{\text{duality}} &
% fourth LPP
\begin{array}{ll}
\min & v = b^T y \\
\text{s.t.} & A^T y - t = c \\
& y,t \ge 0
\end{array} \\
({\cal PS}) & & ({\cal DS})
%
\end{array}

Mermaid

sequenceDiagram
  box Purple Alice & John
  participant A
  participant J
  end
  box Another Group
  participant B
  participant C
  end
  A->>J: Hello John, how are you?
  J->>A: Great!
  A->>B: Hello Bob, how is Charly ?
  B->>C: Hello Charly, how are you?

Python

#!/usr/bin/env python
"""Test file for Python syntax highlighting in editors / IDEs.

Meant to cover a wide range of different types of statements and expressions.
Not necessarily sensical or comprehensive (assume that if one exception is
highlighted that all are, for instance).

Extraneous trailing whitespace can't be tested because of svn pre-commit hook
checks for such things.

"""
# Comment
# OPTIONAL: XXX catch your attention
# TODO(me): next big thing
# FIXME: this does not work

# Statements
from __future__ import with_statement  # Import
from sys import path as thing

print(thing)

assert True  # keyword


def foo():  # function definition
    return []


class Bar(object):  # Class definition
    def __enter__(self):
        pass

    def __exit__(self, *args):
        pass

foo()  # UNCOLOURED: function call
while False:  # 'while'
    continue
for x in foo():  # 'for'
    break
with Bar() as stuff:
    pass
if False:
    pass  # 'if'
elif False:
    pass
else:
    pass

# Constants
'single-quote', u'unicode'  # Strings of all kinds; prefixes not highlighted
"double-quote"
"""triple double-quote"""
'''triple single-quote'''
r'raw'
ur'unicode raw'
'escape\n'
'\04'  # octal
'\xFF'  # hex
'\u1111'  # unicode character
1  # Integral
1L
1.0  # Float
.1
1+2j  # Complex

# Expressions
1 and 2 or 3  # Boolean operators
2 < 3  # UNCOLOURED: comparison operators
spam = 42  # UNCOLOURED: assignment
2 + 3  # UNCOLOURED: number operators
[]  # UNCOLOURED: list
{}  # UNCOLOURED: dict
(1,)  # UNCOLOURED: tuple
all  # Built-in functions
GeneratorExit  # Exceptions

Snippet:

<div>
  A sample content
</div>

* {
  color: var(--danger);
}

(() => {
  const element = document.createElement('p');
  element.textContent = 'Created dynamically using Javascript!';
  document.body.appendChild(element);
})();

Below animation is HTML/CSS/JS code injected directly into the page:

Highlight Testing

CSS Animated Birds

About