lost Wave

With #OXID eShop release 6.1.2 all editions we introduce the new Wave theme to the public which will be packaged with compilation. Read more about it.

In the storefront, only minor adjustments were made in comparison to the Flow theme: our aim is not to restyle or redesign the existing Flow theme – rather our duty is to deliver a lightweight, slender and willowy (yet functional) basis for your projects that you don’t have to purge first. However, we want to improve and update some frontend components. In this manner, Wave is more a progression than an evolution.

I still don't get it. They copy all the legacy JavaScript from the pre-predecessor theme, switch from #Bootcrap 3 to Bootcrap 4 and call it a new theme? #WTF?!?

Styling placeholder

One of the first plugins that would hit a new framework in the early days of JavaScript frameworks was a placeholder plugin, which is why we were so excited when HTML5 brought us the placeholder attribute. Then CSS lovers like me were thrilled when the CSS spec allowed us to style placeholders.

Chrome?

What is wrong with web browsers? FF, Edge and IE11 show the same result. This strange Chrome browser warps images when resizing the window, extends the viewport when moving something out to the right, etc. I am getting to old for this shit.

When a database dump is not a complete dump ...

With a bit python it was possible to transform a Druapl 8's sqlite3 dump into a sql file that I could import into MariaDB 10.3. Surprisingly the whole multi domain and multi language website seemed to work quite fine in frontend and backend on a first and second look. Just the dblog is filling with unserialize errors from the key value store. Looks like there are entries which do not get out of sqlite3 correctly. Neither through dump, nor cli.

Query the database directly with the sqlite3 cli$ sqlite3 sites/default/files/.ht.sqlite "SELECT * FROM key_value WHERE name = 'user.entity_type'"entity.definitions.installed|user.entity_type|O:36:"Drupal\Core\Entity\ContentEntityType":37:{s:15:"

Actually this is the same like the sqlite3 cli$ ../bin/drush sql-query "SELECT * FROM key_value WHERE name = 'user.entity_type'"entity.definitions.installed|user.entity_type|O:36:"Drupal\Core\Entity\ContentEntityType":37:{s:15:"

Is this Drupal 8 Magic? :-!$ ../bin/drush php-eval "\$r=db_query('SELECT * FROM key_value WHERE name = \"user.entity_type\"')->fetchAll(); print_r(\$r[0]->value);"O:36:"Drupal\Core\Entity\ContentEntityType":37:{s:15:"*static_cache";b:1;s:15:"*render_cache";b:1;s:19:"*persistent_cache";b:1;s:14:"*entity_keys";a:6:{s:2:"id";s:3:"uid";s:8:"langcode";s:8:"langcode";s:4:"uuid";s:4:"uuid";s:8:"revision";s:0:"";s:6:"bundle";s:0:"";s:16:"default_langcode";s:16:"default_langcode";}s:5:"*id";s:4:"user";s:16:"*originalClass";s:23:"Drupal\user\Entity\User";s:11:"*handlers";a:9:{s:7:"storage";s:23:"Drupal\user\UserStorage";s:14:"storage_schema";s:29:"Drupal\user\UserStorageSchema";s:6:"access";s:36:"Drupal\user\UserAccessControlHandler";s:12:"list_builder";s:27:"Drupal\user\UserListBuilder";s:10:"views_data";s:25:"Drupal\user\UserViewsData";s:14:"route_provider";a:1:{s:4:"html";s:36:"Drupal\user\Entity\UserRouteProvider";}s:4:"form";a:3:{s:7:"default";s:23:"Drupal\user\ProfileForm";s:6:"cancel";s:31:"Drupal\user\Form\UserCancelForm";s:8:"register";s:24:"Drupal\user\RegisterForm";}s:11:"translation";s:37:"Drupal\user\ProfileTranslationHandler";s:12:"view_builder";s:36:"Drupal\Core\Entity\EntityViewBuilder";}s:19:"*admin_permission";s:16:"administer users";s:25:"*permission_granularity";s:11:"entity_type";s:8:"*links";a:4:{s:9:"canonical";s:12:"/user/{user}";s:9:"edit-form";s:17:"/user/{user}/edit";s:11:"cancel-form";s:19:"/user/{user}/cancel";s:10:"collection";s:13:"/admin/people";}s:17:"*label_callback";s:16:"user_format_name";s:21:"*bundle_entity_type";N;s:12:"*bundle_of";N;s:15:"*bundle_label";N;s:13:"*base_table";s:5:"users";s:22:"*revision_data_table";N;s:17:"*revision_table";N;s:13:"*data_table";s:16:"users_field_data";s:15:"*translatable";b:1;s:19:"*show_revision_ui";b:0;s:8:"*label";O:48:"Drupal\Core\StringTranslation\TranslatableMarkup":3:{s:9:"*string";s:4:"User";s:12:"*arguments";a:0:{}s:10:"*options";a:0:{}}s:19:"*label_collection";s:0:"";s:17:"*label_singular";s:0:"";s:15:"*label_plural";s:0:"";s:14:"*label_count";a:0:{}s:15:"*uri_callback";N;s:8:"*group";s:7:"content";s:14:"*group_label";O:48:"Drupal\Core\StringTranslation\TranslatableMarkup":3:{s:9:"*string";s:7:"Content";s:12:"*arguments";a:0:{}s:10:"*options";a:1:{s:7:"context";s:17:"Entity type group";}}s:22:"*field_ui_base_route";s:22:"entity.user.admin_form";s:26:"*common_reference_target";b:1;s:22:"*list_cache_contexts";a:0:{}s:18:"*list_cache_tags";a:1:{i:0;s:9:"user_list";}s:14:"*constraints";a:1:{s:13:"EntityChanged";N;}s:13:"*additional";a:0:{}s:8:"*class";s:23:"Drupal\user\Entity\User";s:11:"*provider";s:4:"user";s:20:"*stringTranslation";N;}How to get a complete dump from the sqlite3 database?

Measure Sitespeed

Wonderful tool(s)! The Docker image is 1,6GB big, but it does combine quite a lot of things and makes it very convenient to use. In contrast to other such performance tools sponsored by a big company, Sitespeed.io complains about GA and GTM usage.

Add pagination to TYPO3 default File Links Content Element

Ever wondered how to add a Fluid paginate widget to a non Extbase extension in TYPO3 #CMS? For example a core Content Element (CE) and fluid_styled_content? It is straight forward when you are familiar with TYPO3, but there was one not quite obvious workaround needed to make it complete. The following solution is tested in TYPO3 v9.1 and v9.2, but it is possible that there will be another solution in core in the future.

I have a TYPO3 default File Links [uploads] Content Element (CE) and wanted to output a collection from a folder with a lot of files. I was surprised, that there was no pagination available, but it is a fluid styled template, so it was easy to add a paginate widget.

Add to your ext Template setup following TypoScript to set an alternative template name for File Links CE. Also add a workaround for non-extbase elements like the File Links CE [uploads]. This is needed so that the Fluid paginate ViewHelper will also work. Otherwise you have pagination, but only results from the first page are shown, because no controller is executed.### Customised TYPO3's File Links Content Element with pagination template.## CType: uploads

You can take the default template from typo3/sysext/fluid_styled_content/Resources/Private/Templates/Uploads.html and save it at typo3conf/ext/myext/Resources/Private/ContentTemplates/MyFilePagination.html. In your customised template add the Fluid paginate widget ViewHelper around the for ViewHelper and change the variable according:<f:widget.paginate objects="{files}" as="paginatedFiles" configuration="{itemsPerPage: 10, insertAbove: 1, insertBelow: 1, maximumNumberOfLinks: 10}"> <f:for each="{paginatedFiles}" as="file" iteration="fileIterator">

Drupal webform mail template override

I was struggling how to configure a module which actually needed more than just module--key identifiers. For example when you have several Drupal webforms or even several handlers for one webform. It was not directly obvious how to access each handler, but actually it is quite simple:swiftmailer--webform--[webform-node-id].html.twigswiftmailer--webform--[webform-node-id]-[handler-id].html.twig

TYPO3 v9.2

Was fighting with Drupal8 half of my work day just to get stupid alternative mail templates for webform handlers with swiftmailer in production. And then in the evening I updated a private project to the new TYPO3 9.2 release and it was such a relief.

There will be a security release of Drupal 7.x, 8.3.x, 8.4.x, and 8.5.x on March 28th 2018 between 18:00 - 19:30 UTC, one week from the publication of this document, that will fix a highly critical security vulnerability. The Drupal Security Team urges you to reserve time for core updates at that time because exploits might be developed within hours or days.

Selenoid is a powerful implementation of Selenium hub using Docker containers to launch browsers.

Lightweight and Lightning FastSuitable for personal usage and in big clusters:* Consumes 10 times less memory than Java-based Selenium server under the same load* Small 7 Mb binary with no external dependencies (no need to install Java)* Browser consumption API working out of the box* Ability to send browser logs to centralized log storage (e.g. to the ELK-stack)* Fully isolated and reproducible environment

inclusive design

A blog trying to be a pattern library. All about designing inclusive web interfaces, piece by piece.

What is inclusive-components.design?A blog trying to be a pattern library, with a focus on inclusive design. Each post explores a common interface component and comes up with a better, more robust and accessible version of it.

Why?Because the web is full of interfaces which don't consider the diversity of abilities, circumstances, and preferences of their users.

What do you mean by component?A module, a part of your interface, an entry in your pattern library. A bit of what you make as a designer and developer.

Thou Shalt Not Depend on Me

Web developers routinely rely on third-party JavaScript libraries such as jQuery to enhance the functionality of their sites. However, if not properly maintained, such dependencies can create attack vectors allowing a site to be compromised.

In this paper, we conduct the first comprehensive study of client-side JavaScript library usage and the resulting security implications across the Web. Using data from over 133k websites, we show that 37% of them include at least one library with a known vulnerability; the time lag behind the newest release of a library is measured in the order of years. In order to better understand why websites use so many vulnerable or outdated libraries, we track causal inclusion relationships and quantify different scenarios. We observe sites including libraries in ad hoc and often transitive ways, which can lead to different versions of the same library being loaded into the same document at the same time. Furthermore, we find that libraries included transitively, or via ad and tracking code, are more likely to be vulnerable. This demonstrates that not only website administrators, but also the dynamic architecture and developers of third-party services are to blame for the Web’s poor state of library management.

The results of our work underline the need for more thorough approaches to dependency management, code maintenance and third-party code inclusion on the Web.