The Wiert Corner – irregular stream of stuff

Jeroen W. Pluimers on .NET, C#, Delphi, databases, and personal interests

  • My badges

  • Twitter Updates

  • My Flickr Stream

  • Pages

  • All categories

  • Enter your email address to subscribe to this blog and receive notifications of new posts by email.

    Join 1,862 other subscribers

Archive for the ‘Web Development’ Category

Reminder: check if LUMC Privacy Statement and Gebruiksvoorwaarden are printable or downloadable as PDF.

Posted by jpluimers on 2021/02/26

Reminder to check out the results of this thread: [WayBack] Thread by @jpluimers: “Jammer dat het Privacy Statement op mijnlumc.lumc.nl/mijnlumc/?#/co… als een pop-up zichtbaar is, waardoor je het niet volledig kunt afdrukk […]”.

Related:

Thread:

Jammer dat het Privacy Statement op mijnlumc.lumc.nl/mijnlumc/?#/co… als een pop-up zichtbaar is, waardoor je het niet volledig kunt afdrukken of als PDF opslaan.

Vreemd ook dat de tekst op lumc.nl/12367/ anders is dan in de consent hierboven.

Kan @LUMC_Leiden dat oplossen?

Idem voor de Gebruiksvoorwaarden. Daar is geen alternatieve tekst van.
mentions In onderstaande code gaan de aanpassingen in beide <span>…</span> blokken zitten.

–jeroen

Read the rest of this entry »

Posted in Chrome, Development, LifeHacker, Power User, Software Development, Web Browsers, Web Development | Leave a Comment »

How not to do updates of your wiki site

Posted by jpluimers on 2021/02/17

If your company manages your own infrastructure, be sure you have monitoring on all levels.

It saves you from customers discovering issues like this: [WayBack] Thread by @jpluimers: “The @EmbarcaderoTech docwiki is down due to an error in duobook2.[…]”:

The @EmbarcaderoTech docwiki is down due to an error in duobook2. URLs pointing to wiki content fail, no matter the product. Examples for Rio and XE2 grabbed from docwiki.embarcadero.com/Libraries/Rio/… and docwiki.embarcadero.com/Libraries/XE2/…


This is the reason for allowing archival of all your product documentation web-content in the @internetarchive, even for non-current products, as now only parts that have been allowed to save in the past are available.

Apart from nobody noticing the outage yet, which is bad in it’s own way, I hope the cause is not somebody fiddling with duobook (3 year old and unmaintained) without testing the consequences. As that would make the cause of the outage embarrassing.

[WayBack] https://github.com/ElectricVersion/DuoBook

Finally it is rather odd to get a HTTP 200 SUCCESS code on a failure. A HTTP 500 or 503 would be far more appropriate.

I wonder if that is a @mediawiki thing; maybe they could shed some light on that.

References en.wikipedia.org/wiki/List_of_H… and en.wikipedia.org/wiki/List_of_H….

The cool thing is that the stack traces teach you a lot about how a framework is structured.

Related:

  • [Archive.is/WayBack] RAD Studio API Documentation: Rio
    Exception encountered, of type "ArgumentCountError"
    [6a5b64d3a502a9acff148fe1] /Libraries/Rio/en/Main_Page ArgumentCountError from line 420 of /var/www/html/shared/BaseWiki27/skins/DuoBook2/DuoBook2.php: Too few arguments to function DuoBook2Template::displayPrefs(), 0 passed in /var/www/html/shared/BaseWiki27/skins/DuoBook2/DuoBook2.php on line 99 and exactly 1 expected
    Backtrace:
    #0 /var/www/html/shared/BaseWiki27/skins/DuoBook2/DuoBook2.php(99): DuoBook2Template->displayPrefs()
    #1 /var/www/html/shared/BaseWiki27/includes/skins/SkinTemplate.php(248): DuoBook2Template->execute()
    #2 /var/www/html/shared/BaseWiki27/includes/OutputPage.php(2335): SkinTemplate->outputPage()
    #3 /var/www/html/shared/BaseWiki27/includes/MediaWiki.php(743): OutputPage->output()
    #4 /var/www/html/shared/BaseWiki27/includes/MediaWiki.php(509): MediaWiki->main()
    #5 /var/www/html/shared/BaseWiki27/index.php(43): MediaWiki->run()
    #6 {main}
  • [Archive.is/WayBack] XE2 API Documentation
    Exception encountered, of type "ArgumentCountError"
    [d3d353581c3915881b976ab6] /Libraries/XE2/en/Main_Page ArgumentCountError from line 420 of /var/www/html/shared/BaseWiki27/skins/DuoBook2/DuoBook2.php: Too few arguments to function DuoBook2Template::displayPrefs(), 0 passed in /var/www/html/shared/BaseWiki27/skins/DuoBook2/DuoBook2.php on line 99 and exactly 1 expected
    Backtrace:
    #0 /var/www/html/shared/BaseWiki27/skins/DuoBook2/DuoBook2.php(99): DuoBook2Template->displayPrefs()
    #1 /var/www/html/shared/BaseWiki27/includes/skins/SkinTemplate.php(248): DuoBook2Template->execute()
    #2 /var/www/html/shared/BaseWiki27/includes/OutputPage.php(2335): SkinTemplate->outputPage()
    #3 /var/www/html/shared/BaseWiki27/includes/MediaWiki.php(743): OutputPage->output()
    #4 /var/www/html/shared/BaseWiki27/includes/MediaWiki.php(509): MediaWiki->main()
    #5 /var/www/html/shared/BaseWiki27/index.php(43): MediaWiki->run()
    #6 {main}

–jeroen

Read the rest of this entry »

Posted in Development, DevOps, Infrastructure, Power User, Software Development, Web Development | Leave a Comment »

A choco install list

Posted by jpluimers on 2021/02/03

Sometimes I forget the choco install mnemonics for various tools, so here is a small list below.

Of course you have to start with an administrative command prompt, and have a basic Chocolatey Installation in place.

If you want to clean cruft:

choco install --yes choco-cleaner

Basic install:

choco install --yes 7zip
choco install --yes everything
choco install --yes notepadplusplus
choco install --yes beyondcompare
choco install --yes git.install --params "/GitAndUnixToolsOnPath /NoGitLfs /SChannel /NoAutoCrlf /WindowsTerminal"
choco install --yes hg
choco install --yes sourcetree
choco install --yes sysinternals

For VMs (pic one):

choco install --yes vmware-tools
choco install --yes virtio-drivers

For browsing (not sure yet about Chrome as that one has a non-admin installer as well):

choco install --yes firefox

For file transfer (though be aware that some versions of Filezilla contained adware):

choco install --yes filezilla
choco install --yes winscp

For coding:

choco install --yes vscode
choco install --yes atom

For SQL server:

choco install --yes sql-server-management-studio

For web development / power user:

choco install --yes fiddler

For SOAP and REST:

choco install --yes soapui

If you don’t like manually downloading SequoiaView at gist.github.com/jpluimers/b0df9c2dba49010454ca6df406bc5f3d (e8efd031d667de8a1808d6ea73548d77949e7864.zip):

choco install --yes windirstat

For drawing, image manipulation (paint.net last, as it needs a UI action):

choco install --yes gimp
choco install --yes imagemagick
choco install --yes paint.net

For ISO image mounting in pre Windows 10:

choco install --yes wincdemu

For hard disk management:

choco install --yes hdtune
choco install --yes seatools
choco install --yes speedfan

For Fujitsu ScanSnap scanners (not sure yet this includes PDF support):

choco install --yes scansnapmanager

–jeroen

Posted in 7zip, atom editor, Beyond Compare, Chocolatey, Compression, Database Development, Development, DVCS - Distributed Version Control, Everything by VoidTools, Fiddler, Firefox, Fujitsu ScanSnap, git, Hardware, Mercurial/Hg, Power User, Scanners, SOAP/WebServices, Software Development, Source Code Management, SQL Server, SSMS SQL Server Management Studio, SysInternals, Text Editors, Versioning, Virtualization, VMware, VMware ESXi, vscode Visual Studio Code, Web Browsers, Web Development, Windows | Leave a Comment »

HTML Div Table – Online Tools

Posted by jpluimers on 2021/02/02

[WayBack] HTML Div Table – Online Tools:

Free online tools to make Div Table composing a piece of cake! HTML table generator and converter with interactive source editor and much more!

I hope this still exists, as the first time it helped me convert HTML table based tables to div based tables.

They had these tools back then:

  • [WayBack] HTML Div Table Generator

    Generate HTML Div table grids for websites in just a few easy steps. Set the options then select the desired size. Adjust the options in the interactive editors

  • [WayBack] HTML Table to Div Converter

    Transform traditional HTML Tables to Div Tables. Copy and convert any visual table document to Div tables with a simple click of a button

  • [WayBack] HTML Table Styler 📅 CSS Generator

    Free online interactive HTML Table and structured div grid styler and code generator. Select a style from the gallery and adjust the settings to get the HTML and CSS codes.

–jeroen

Posted in Development, HTML, Software Development, Web Development | Leave a Comment »

HTML table border styles

Posted by jpluimers on 2021/01/20

I always get confused when I see this kind of HTML:

<td style="border: 1px black; border-style: none solid solid;">

This raises questions like:

  • When less than 4 borders are mentioned, which borders are solid, and which borders are none?
  • What is the order of 0…4 borders?

Luckily these links helped me:

  1. [WayBack] w3schools: CSS border-style property
  2. [WayBack] w3schools: CSS Borders
  3. [WayBack] border-style – CSS: Cascading Style Sheets | MDNThe border-style CSS property is a shorthand property that sets the line style for all four sides of an element’s border.

The first two made me find the last one, which is best as it has a CSS demo button (that also works on the WayBack link), a list of examples, and even better, answers the above questions with the “border-style” list below.

I rephrased their list into a table emphasising the clock-wise order:

The number of values determine the sides affected; thinking clock-wise is easiest to get it:

# values affected sides example top right bottom left
1 all: top, right, bottom, left solid solid solid solid solid
2 top & bottom, right & left none solid none solid none solid
3 top, right & left, bttom dotted none solid dotted none solid none
4 top, right, bottom, left double dotted solid none double dotted solid none

Their list:

The border-style property may be specified using one, two, three, or four values.

  • When one value is specified, it applies the same style to all four sides.
  • When two values are specified, the first style applies to the top and bottom, the second to the left and right.
  • When three values are specified, the first style applies to the top, the second to the left and right, the third to the bottom.
  • When four values are specified, the styles apply to the toprightbottom, and left in that order (clockwise).

Each value is a keyword chosen from the list below.

then it continues with a table showing the outcome of the various line style values you can put in:

<line-style>
Describes the style of the border. It can have the following values:

none
Like the hidden keyword, displays no border. Unless a background-image is set, the calculated value of border-top-width will be 0, even if the specified value is something else. In the case of table cell and border collapsing, the none value has the lowest priority: if any other conflicting border is set, it will be displayed.
hidden
Like the none keyword, displays no border. Unless a background-image is set, the calculated value of border-top-width will be 0, even if the specified value is something else. In the case of table cell and border collapsing, the hidden value has the highestpriority: if any other conflicting border is set, it won’t be displayed.
dotted
Displays a series of rounded dots. The spacing of the dots is not defined by the specification and is implementation-specific. The radius of the dots is half the calculated border-top-width.
dashed
Displays a series of short square-ended dashes or line segments. The exact size and length of the segments are not defined by the specification and are implementation-specific.
solid
Displays a single, straight, solid line.
double
Displays two straight lines that add up to the pixel size defined by border-width or border-top-width.
groove
Displays a border with a carved appearance. It is the opposite of ridge.
ridge
Displays a border with an extruded appearance. It is the opposite of groove.
inset
Displays a border that makes the element appear embedded. It is the opposite of outset. When applied to a table cell with border-collapse set to collapsed, this value behaves like groove.
outset
Displays a border that makes the element appear embossed. It is the opposite of inset. When applied to a table cell with border-collapse set to collapsed, this value behaves like ridge.

–jeroen

Posted in CSS, Development, HTML, HTML5, Software Development, Web Development | Leave a Comment »

TODO: if weerslag hasn’t supported https yet, dig deeper into ProxyPass / ProxyPassReverse

Posted by jpluimers on 2021/01/12

I’ve this page for my brother: https://martijn.pluimers.com/agenda-month-weather.html.

It serves his agenda plus a few weather widgets.

The weerslag widget fails to load as it’s in an iframe pointing to http but the page is https. That’s not allowed as shown in this nice table at [WayBackssl – Insecure content in iframe on secure page – Stack Overflow by amol-ghotankar and richard:

page  - iframe - status
----- - -----  - -----------
http  - http   - allowed
http  - https  - allowed
https - http   - not allowed
https - https  - allowed

So I put it behind a simple Apache reverse proxy: https://www.pluimers.com/maps.weerslag.nl/GratisRadar/1201/864/verwacht?zoom=10:


<Location /maps.weerslag.nl>
ProxyPass http://maps.weerslag.nl
ProxyPassReverse http://maps.weerslag.nl
Require all granted
</Location>

If they still haven’t fixed their https access, I need to dig deeper into this.

When writing this [Arhive.ishttps://maps.weerslag.nl/GratisRadar/1201/864/verwacht?zoom=10 gave a 404 and http://maps.weerslag.nl/GratisRadar/1201/864/verwacht?zoom=10 misbehaved behind the proxy:

–jeroen

Posted in *nix, Apache2, Development, Power User, Web Development | Leave a Comment »

Stofradar – RevSpace

Posted by jpluimers on 2020/12/10

On my list to play around with: [WayBack] Stofradar – RevSpace.

It gets data from [WayBack] luftdaten.info – Feinstaub selber messen – Open Data und Citizen Science aus Stuttgart , then visualises it.

Via: [WayBack] Helga van Leur on Twitter: “Deze animatie van de uitstoot fijnstof tijdens jaarwisseling is ook treffend… Opvallend is hotspot Veghel e.o. en op Veluwe. Bron: …”

jeroen

Read the rest of this entry »

Posted in Development, Software Development, Web Development | Leave a Comment »

GitHub – DevExpress/testcafe: A Node.js tool to automate end-to-end web testing.

Posted by jpluimers on 2020/12/09

In my list of things to play with: [WayBack] GitHub – DevExpress/testcafe: A Node.js tool to automate end-to-end web testing.:

A Node.js tool to automate end-to-end web testing.
Write tests in JS or TypeScript, run them and view results.

https://devexpress.github.io/testcafe


  • Works on all popular environments: TestCafe runs on Windows, MacOS, and Linux. It supports desktop, mobile, remote and cloud browsers (UI or headless).
  • 1 minute to set up: You do not need WebDriver or any other testing software. Install TestCafe with one command, and you are ready to test: npm install -g testcafe
  • Free and open source: TestCafe is free to use under the MIT licensePlugins provide custom reports, integration with other tools, launching tests from IDE, etc. You can use the plugins made by the GitHub community or make your own.

Related:

  • [WayBack] A node.js tool to automate end-to-end web testing | TestCafe:

    Use TestCafe to write tests in JS or TypeScript, run them and view results. TestCafe runs on Windows, MacOS, and Linux and takes 1 minute to set up.

  • [WayBack] TestCafe: Web Testing Framework | DevExpress

    100% web-based functional testing framework with integrated visual test recorder, remote device testing, and natural JavaScript API

    • From download to recording your first test in less than 5 minutes — installer automatically configures your environment.
    • With TestCafe, you can run tests in any browser that supports HTML5 (including IE9+, Chrome, Firefox, Safari, Opera).
    • TestCafe is operating system agnostic so you can run tests on Windows, Mac or Linux machines.
    • Run tests on remote computers and mobile devices.
    • Run tests in multiple browsers and on multiple machines in parallel.
    • Run tests in the background on any machine.
    • TestCafe allows you to test web pages that require Basic and Windows HTTP Authentication.

Via:

Screen materials below the fold.

–jeroen

Read the rest of this entry »

Posted in Development, JavaScript/ECMAScript, LifeHacker, Power User, Scripting, Software Development, Testing, Web Development | Leave a Comment »

Tables with two headers • Tables • WAI Web Accessibility Tutorials

Posted by jpluimers on 2020/12/08

Since I always forget that you can have any cell marked as th to make it a header: [WayBack] Tables with two headers • Tables • WAI Web Accessibility Tutorials.

This is not just limited to top rows, you can use it any where:

  • in the left column
  • in any other row
  • in any other column
  • in individual cells

In addition, a table can also have a caption, which is not just useful for screen-readers: it benefits general readability.

Quoting the page:

For such tables, use the <th> element to identify the header cells and the scope attribute to declare the direction of each header. The scopeattribute can be set to row or col to denote that a header applies to the entire row or column, respectively.

Additionally, you can use the <caption> element to identify the table in a document. This is particularly useful for screen-reader users browsing the web page in “table mode” where they can navigate from table to table.

Examples on that page:

–jeroen

Posted in Development, HTML, HTML5, Software Development, Web Development | Leave a Comment »

Making it dead simple to implement @haveibeenpwnd in your applications, including strength warning if found in @troyhunt’s password collection.

Posted by jpluimers on 2020/12/02

I wasn’t aware that Troy Hunt created an API [WayBack] for [WayBack] Have I Been Pwned: Check if your email has been compromised in a data breach.

He did, as I noticed through [WayBack] Michelangelo van Dam on Twitter: “Making it dead simple to implement @haveibeenpwnd in my applications, including strength warning if found in @troyhunt’s password collection. Check out to try it out yourself. #ImproveSecurity #haveibeenpwnd”.

There are in fact plenty of other packages, web-sites and apps using the API as seen on [WayBack] Have I Been Pwned: API consumers.

Many people ask “if it is safe” (often assuming passwords are sent in clear, or hashes are sent in full; my fear is that those people implement security somewhere).

It is safe:

PHP source is at [WayBack] GitHub – DragonBe/hibp: A composer package to verify if a password was previously used in a breach using Have I Been Pwned API.

There is also a [WayBack] composer package at [WayBack] dragonbe/hibp – Packagist.

A really cool thing on it is this:

This project was also the subject of my talk [WayBack] Mutation Testing with Infection where the code base was not only covered by unit tests, but also was subjected to Mutation Testing using [WayBack] Infection to ensure no coding mistakes could slip into the codebase.

Apart from the tests, the most important source is at [WayBack] hibp/Hibp.php at master · DragonBe/hibp · GitHub

Related:

–jeroen

Posted in Development, Mobile Development, PHP, Python, Scripting, Software Development, Web Development | Leave a Comment »