Wikitests // title test : test title via title2 template

From Whonix
< Dev
Jump to navigation Jump to search

Template:Devwiki

About this Dev/wikitest Page
Contributor maintained wiki page.
Support Status testing
Difficulty medium
Contributor testing
Support Dev/website

This is the intro template.

This is the first line of the content text outside the intro template.

Modules / Features (alphabetical)[edit]

Anchor (Template)[edit]

Click the link below and it should jump to the "Jump point". There is the id "test-anchor-template"

Jump point

Paragraph to jump over

#test-anchor-template

Archive_Link (Template, nested Widget)[edit]

Different archive link tests, wrapped in div.info-box to prevent over-width on mobile

Blockquote & Quotation Tests[edit]

Blockquote[edit]

For wiki content writers it is customary to write keywords such as <blockquote> into a separate line for easier readability during editing. But if that has to be avoided and changed in the wiki content (wiki markup), then that would be OK too.

<blockquote>line number one
line number two
line number three
now there will be an empty line

    this line has leading whitespace
last but one line
last line</blockquote>

Test result, too much white space:

line number one

line number two

line number three

now there will be an empty line

this line has leading whitespace last but one line

last line

Complex Blockquote Example[edit]

This is how it really looks:

gpg: assuming signed data in 'tor-{{Tor_upstream_version}}.tar.gz'
gpg: Signature made Mon 09 Dec 2019 06:21:51 PM UTC
gpg:                using RSA key 7A02B3521DC75C542BA015456AFEE6D49E92B601
gpg: Good signature from "Nick Mathewson <nickm@alum.mit.edu>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@wangafu.net>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@freehaven.net>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@torproject.org>" [unknown]
gpg: WARNING: This key is not certified with a trusted signature!
gpg:          There is no indication that the signature belongs to the owner.
Primary key fingerprint: 2133 BC60 0AB1 33E1 D826  D173 FE43 009C 4607 B1FB
     Subkey fingerprint: 7A02 B352 1DC7 5C54 2BA0  1545 6AFE E6D4 9E92 B601

This is how it should look:

gpg: assuming signed data in 'tor-{{Tor_upstream_version}}.tar.gz'
gpg: Signature made Mon 09 Dec 2019 06:21:51 PM UTC
gpg:                using RSA key 7A02B3521DC75C542BA015456AFEE6D49E92B601
gpg: Good signature from "Nick Mathewson <nickm@alum.mit.edu>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@wangafu.net>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@freehaven.net>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@torproject.org>" [unknown]
gpg: WARNING: This key is not certified with a trusted signature!
gpg:          There is no indication that the signature belongs to the owner.
Primary key fingerprint: 2133 BC60 0AB1 33E1 D826  D173 FE43 009C 4607 B1FB
     Subkey fingerprint: 7A02 B352 1DC7 5C54 2BA0  1545 6AFE E6D4 9E92 B601

Potential bug: Between line Primary key fingerprint: 2133 BC60 0AB1 33E1 D826 D173 FE43 009C 4607 B1FB and line Subkey fingerprint: 7A02 B352 1DC7 5C54 2BA0 1545 6AFE E6D4 9E92 B601 there is no newline in the wiki markup and there should be none in the resulting mediawiki auto generated HTML. Some CSS issue probably?

new test blockquote[edit]

line1    after 5 spaces
line2    now an empty line

line3
line4

blockquote in bullet point[edit]

As the first child

  • test

As not the first child after a text (or other) node

  • 1

    test

div class pre blockquote[edit]

real pre tag:

gpg: assuming signed data in 'tor-{{Tor_upstream_version}}.tar.gz'
gpg: Signature made Mon 09 Dec 2019 06:21:51 PM UTC
gpg:                using RSA key 7A02B3521DC75C542BA015456AFEE6D49E92B601
gpg: Good signature from "Nick Mathewson <nickm@alum.mit.edu>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@wangafu.net>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@freehaven.net>" [unknown]
gpg:                 aka "Nick Mathewson <nickm@torproject.org>" [unknown]
gpg: WARNING: This key is not certified with a trusted signature!
gpg:          There is no indication that the signature belongs to the owner.
Primary key fingerprint: 2133 BC60 0AB1 33E1 D826  D173 FE43 009C 4607 B1FB
     Subkey fingerprint: 7A02 B352 1DC7 5C54 2BA0  1545 6AFE E6D4 9E92 B601

div class="pre"

gpg: assuming signed data in 'tor-0.4.6.5.tar.gz'

gpg: Signature made Mon 09 Dec 2019 06:21:51 PM UTC gpg: using RSA key 7A02B3521DC75C542BA015456AFEE6D49E92B601 gpg: Good signature from "Nick Mathewson <nickm@alum.mit.edu>" [unknown] gpg: aka "Nick Mathewson <nickm@wangafu.net>" [unknown] gpg: aka "Nick Mathewson <nickm@freehaven.net>" [unknown] gpg: aka "Nick Mathewson <nickm@torproject.org>" [unknown] gpg: WARNING: This key is not certified with a trusted signature! gpg: There is no indication that the signature belongs to the owner. Primary key fingerprint: 2133 BC60 0AB1 33E1 D826 D173 FE43 009C 4607 B1FB

Subkey fingerprint: 7A02 B352 1DC7 5C54 2BA0 1545 6AFE E6D4 9E92 B601

Quotation Template Tests[edit]

Functional[edit]

Quotation without anything - should show {{{quote}}}

{{{quote}}}

Quotation Two Line Test

Quotation with 2 lines.

Should show 2 lines.

Quotation with 2 Lines and Context Test

abc

def

Simple Quotation with 2 Lines, Context and Image Test

With an image.

123

456

Simple Quotation with 2 Lines, Context and Image Test, special style

With an image.

123

456

Broken[edit]

Bullet Point Quotation with 2 Lines, Context and Image Test

Same as above but below a bullet point. NOTE: This does not work as expected but it acceptable right now because this is caused by a bug in MediaWiki that has been reported.

* bullet point with colon: {{Quotation
|image=Deep-web-1106648640.jpg
|context=Author,Date,https://www.whonix.org
|quote=With an image.

abc

def}}

Bullet Point Multiple Lines Quotation Test (currently broken)

  • 1

    Same as above but below a list item.

Without an image.

NOTE: This does not work as expected but it acceptable right now because this is caused by a bug in MediaWiki that has been reported

CodeSelect[edit]

Simple example 1 line

echo "Hello World"

1 line, but inline

Here is an example echo "Hello World" that was the example

2 lines

sudo chmod og+rx /usr/bin/snowflake-client sudo chmod og+rx /usr/bin/snowflake-client

CodeSelect in Lists

  • text
  • abc
  • def ghi123 asölfkasjdölfkajdöslkjasdfölkfjaölksdjaslökdjfaöslkjfaöslkjfdsalökdjfalöksjfaklösjfaslökjfasölkjfasölkjfadsölkjafdsklöfjlköasdjflkösajdfsölkjadsölkjfdaslksafjfkl
  • Including pipe symbol ("|") (encoded as {{!}}): echo test | xargs echo
  • test: abc

CodeSelect "Hello World" but as a button

echo "Hello World"

CodeSelect "Hello World" but as a default button (buttonImage=)

echo "Hello World"

CodeSelect "Hello World" button image, eager loading

echo "Hello World"

CodeSelect with a target pre element

This is
example 1
$ sudo apt "example1"

Community Support Template[edit]

Below are 3 tests. The first without the paramter scope, it should show the page version. The second is the page version (scope=page) and the third one is the chapter version (scope=chapter)

Info COMMUNITY SUPPORT ONLY : THIS WHOLE WIKI PAGE is only supported by the community. Whonix developers are very unlikely to provide free support for this content. See Community Support for further information, including implications and possible alternatives.

Info COMMUNITY SUPPORT ONLY : THIS WHOLE WIKI PAGE is only supported by the community. Whonix developers are very unlikely to provide free support for this content. See Community Support for further information, including implications and possible alternatives.

Info COMMUNITY SUPPORT ONLY : THIS wiki CHAPTER only is only supported by the community. Whonix developers are very unlikely to provide free support for this content. See Community Support for further information, including implications and possible alternatives.


ContentImage - Image resize test / Image wrapper template for over-wide images[edit]

Normal over-wide image without wrapper. Expected: Image is too wide on the right

[[File:Image-too-wide-demonstration.jpg]]

The same over-wide image inside wrapper. Expected: Image has 100% width of the content and is not too wide File:Image-too-wide-demonstration.jpg

This image is smaller then the page (100px). But now the parameter |w100=true is added. So the image should be width 100% File:Image-too-wide-demonstration.jpg

DiscoverHiddenElements[edit]

  1. Below are hidden elements. Each should open when you click its link
  2. One is a headline hidden inside a mw-collapsible #DiscoverHiddenElements_Hidden_Headline
  3. The other is a headline hidden inside an mw-collapsible, hidden inside a tab content controller #DiscoverHiddenElements_Hidden_Headline_2
  4. Reference to hidden Footnotes [discover-he-1 1]- show open Footnotes

Hidden Headline

DiscoverHiddenElements Hidden Headline[edit]

Test text

DiscoverHE section1

Section 1 content [discover-he-2 1]

DiscoverHE section2

Section 2 content [discover-he-2 2]

DiscoverHE section3

Section 3 content

Hidden Headline 2

DiscoverHiddenElements Hidden Headline 2

Test text

  1. Discover ref1

Reflist to hidden footnotes

  1. Discover ref 2
  2. Discover ref 3

DonorCard (Template)[edit]

There is a whole page for tests of the DonorCard Testpage_Donors

Download_Button (Widget)[edit]

text, url, redirectUrl=VirtualBox

DownloadTest1

text, addToClass, url, os, targetBlank

DownloadTest2 OSX DEBIAN KVM LINUX QUBES USB VIRTUALBOX WINDOWS

text, url, os, targetBlank, onion, fontSize

DownloadTest3 OSX DEBIAN KVM LINUX

Example with text, url, os, onion, addToClass=text-class, fontsize=20px, targetBlank=true, redirectUrl

Test for Download Button LINUX WINDOWS OSX

Example with signature icon, text and url

Signature test

Example with sha icon, text and url

Sha test

Example with signify icon, text and url

Signify test

Expand Button different labels[edit]

Learn more Label

Click to find out

Hidden Content

Show / Hide Label

Click to find out

Hidden Content

Expand Button versus Content Shift Test[edit]

Expand

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).


Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32.

The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.

Where can I get some? There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.

Expand Or Collapse All[edit]

On "Expand or Collapse All" Button, 3 expand boxes. Clicking the button will open all boxes on the page not only in this test area

Box 1 Preview

Box 1 content

Box 2 Preview

Box 2 content

Box 3 Preview

Box 3 content

GoogleOff (Template)[edit]

These tests can only be verified in browser dev console or in page source code

Simple GoogleOff template test

Simple GoogleOff template test

Div being wrapped in GoogleOff with nosnippet=1

Div being wrapped in GoogleOff with nosnippet=1

Headline (Template)[edit]

h2, id auto-gen ↓↓↓

Test Headline : h2, id auto-gen

no h (=h1), id=id-test-headline-2 ↓↓↓

Test Headline : no h (=h1), id=id-test-headline-2

h3, id=none, addToClass:cs-blue → Code ↓↓↓

Test Headline : h3, id=none, addToClass:cs-blue → Code

HtmlComment (Widget)[edit]

The following html comment in wikitext will not be rendered into the source code

The following html comment (via the HtmlComment widget) will be rendered into the source code

Icon Bullet List[edit]

Default list with longer and shorter list item

  • Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points Plus Points
  • Negative Points

Longer list with addClass=inverse minimal, fontSize=20px

  • Standard
  • Plus Points
  • Negative Points
  • Equal Points
  • Chill Points

Info Tooltip[edit]

There is hidden info that can be seen by hovering over the i-icon

Here's the hidden info

Intro paragraph and IntroLike[edit]

The intro template is demonstrated at the top of the page

Below you see the introLike template

Intro like text

with wikitext

and newlines

LeftRightImageText[edit]

Left example, promo style

Left example

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Right example, with imagelink=/wiki/About, imageright=true

Right example

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

mbox test[edit]

Below you should see a box around the test text

mbox text test

Box with image and text test

Test My Text here

Box with icon and text test

My Text here

Mini Modal[edit]

Open MiniModal below by clicking this button Open Modal

Open MiniModal via URL hash, click Dev/wikitest#mini-modal-test

Mini modal test

Mini Modal test content

Mini Navigation / Mininav[edit]

This is a mininav with one standard field, one field with an image icon, one field with an image icon that is too small and one field with an image icon that does not have link=[emptystring]

Below is a mininav with the class for 2 lines and with the special dark look class mn-dark, wrapped in an info box

PayViaPaypal[edit]

Standard implementation, full width

[nojs text]

Share Tooltip[edit]

Below there is a share tooltip for #share-tooltip-test which is the div below

Anchor link #share-tooltip-test

SitenoticeBanner[edit]

Simple example, but strange optic = correct, because it needs to be in #siteNotice

Subdomain Link[edit]

Please test those links on the onion the Tor browser as well

Link to forum, text=Testlink1, sub=forums, append=/c/news/5

Testlink1

Same as above, but export as url

https://forums.whonix.org/c/news/5

Same as above, but export as parts

https,whonix.org

Tab Controller[edit]

Tab Controller versus Content Shift Test[edit]

Number 1

test1

Number 2

test2

Number 3

test3

A link

Tab Controller Link test[edit]

All link tabs below (not Title 01 and Title 02) should be actual links for js users

Title 01

Title 01

Title 02

Title 02

Link Type 1

[1]archive.org

Link Type 2

Link Type 3

[2]archive.org

Link Type 4

Link Type 5

Tab Controller : Linked Controllers Test[edit]

The following controllers will switch in unison. In case of link-tabs (tabs which are pure links) they will not be switched on. Also important: Section 1 and 6 are asynchronously pre-selected. But once you select a tab they will synchronize and stay synchronize (no common use cases but good to know this behavior)

Section 1

Section 1 content

Section 2

Section 2 content

Section 3

Section 3 content

Section 4

Section 4 content

Section 5

Section 5 content

Section 6

Section 6 content

Section 7 Link

Tab Controller : Linked Controller with nested Controller[edit]

TODO: description

Section 1

Section 1 content

Section 2

Section 2 content

Section 5

Section 5 content

Section 6

Section 6 content

Nested Tab Test : JS / NOJS[edit]

If you open this page in a normal way then Test2 is pre-selected and if you click tab 3 than Test 3.2 will be pre-selected. However if you open this page with the following link (emphasis on the hash) then Test3 will open and Test3.2 will open as well. And it will scroll to the right position. This link can also be otained by right-clicking the tab and clicking "Save link address"

https://www.kicksecure.com/wiki/Dev/wikitest#Test3.3_Auto-Openarchive.org

If you deactive Javascript (NOJS) then the above link will send you directly to the selected section

Test1

Test 1 Content

Test2 Selected

Test 2 Content

Test3 Auto-Open

Test3.1

Test 3.1 Content

Test3.2 Selected

Test 3.2 Content

Test3.3 Auto-Open

Test 3.3 Content

Nested Tab Test : No TOC[edit]

In the TOC you will not find the notoc tabs as headlines because they are done with Template:Headline. However the functionality stays the same. And it also works for Nojs.

Look in the TOC above. There is no Tab Test 11 or Tab Test 12 or 14 mentioned. But this link works : https://www.kicksecure.com/wiki/Dev/wikitest?stable=0#tab-test-14-notocarchive.org

Tab Test 10

Tab Test 10 Content

Tab Test 11 notoc

Tab Test 11 notoc Content

Tab Test 12 notoc

Tab Test 13

Tab Test 13 Content

Tab Test 14 notoc

Tab Test 14 notoc Content

ThumbGallery (Template)[edit]

Below a thumb gallery with 3 thumb images. Check on mobile for the change from column to row

Thumbnails[edit]

Standard behavior (jumps left and changes size when very small screen)

Non-responsive behavior (stays right and keeps size)

VideoLink[edit]

Video should be available on all 3 given platforms (click icons)

Video YouTube icon Invidious icon Onion icon Test video

WikitableAutoWrapper and ScrollableIndicator[edit]

Below is a very long table that is wrapped automatically by javascript in wikitable auto wrapper. Length should always be 100%, also on mobile

test name 1 test name 2
Short info
Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info 

Below is a wikitable that is wrapped inside mw-collapsible (and therefore has no dimensions). So first it will not be enriched, only when the collapsed div will be opened. Click expand. Table should look like above

Open hidden table

test name 3 test name 4
Short info
Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info Long Info 

CSS features[edit]

Col-container[edit]

div with .col-container and .cc-3 wrapping 3 divs 123,456,789

123
456
789

Color schemes[edit]

cs-red

cs-red-light

cs-green

cs-green-light

cs-blue

cs-blue-light

cs-yellow

cs-yellow-light

Columns: use-2-columns, use-3-columns[edit]

Text use-2-columns[edit]

Column1 text Column1 text Column1 text Column1 text Column1 text Column1 text Column1 text Column1 text Column1 text Column1 text
Column2 text Column2 text Column2 text Column2 text Column2 text Column2 text Column2 text Column2 text Column2 text Column2 text

List use-3-columns[edit]

  • List element 1
  • List element 2
  • List element 3
  • List element 4
  • List element 5
  • List element 6
  • A
  • B
  • C

hide-enlarge and thumb-hide-enlarge class[edit]

Original file

SWIFT

File:Swift 128.png|thumb|100px|link=|SWIFT, wrapped in div.thumb-hide-enlarge

SWIFT

File:Swift 128.png|thumb|100px|link=|class=hide-enlarge|SWIF

SWIFT

NoJS classes[edit]

Introduction[edit]

Description is in black. The test cases are in red

Only visible for noJS[edit]

Only visible for nojs

Done.

Only visible for JS[edit]

Only visible for js

Done.

Hide for noJS only[edit]

Hide for nojs only

Done.

Hide for JS only[edit]

Hide for js only

Done.

Mixed[edit]

External Link Test[edit]

https://www.whonix.orgarchive.org

homepagearchive.org

FontAwesome Deprecated Test[edit]

Currently not using this method. Expected to fail.

<i class="fa fa-eercast" aria-hidden="true"></i>
Test START

Test END

HTML Symbol[edit]

Lists Tests[edit]

Unordered List Test[edit]

  • one
  • two
  • three

Ordered Lists Test[edit]

  1. first
  2. second
  3. third

overlength tag test[edit]

pre tag

long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test

long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test

code tag

long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test long test

pre and div.pre tests[edit]

pre test[edit]

The following two lines test1 and test2 are separate pre tags lines. These should be visually separate. Currently functional.

text 1
text 2

div.pre[edit]

Pre without parsing

This is current year

{{CURRENTYEAR}}

Div.pre with parsing

This is current year

2024

Variables[edit]

H1[edit]

Test text

H2[edit]

Test text

H3[edit]

Test text

H4[edit]

Test text

H5[edit]

Test text

H6[edit]

Test text

Tables on Mobile[edit]

Check for example Reasons_for_Freedom_Software for word wrap issues.

TODO: add test here

Footnotes[edit]

We believe security software like Whonix needs to remain open source and independent. Would you help sustain and grow the project? Learn more about our 12 year success story and maybe DONATE!