Releases · dataformsjs/dataformsjs

Security update for the starter/example webserver that is included with the main project.
- The file app.js uses a custom express-like API with a minimal web server which allows DataFormsJS examples to run using Node.js built-in features and no outside dependencies.
- A Path traversal vulnerability was found with credit thanks to Hamidreza Hamidi and Jafar Akhoundali.
- The issue was decodeURIComponent was called out of order allowing for Proof-of-concept (POC) Path traversal attacks on a local developer machine using URLs such as http://127.0.0.1:8080/..%2fpackage.json or bash 127.0.0.1:8080/%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2fetc%2fpasswd
- This impacts the development download of the project but not the NPM published release.
Replaced CDN https://unpkg.com/ with https://www.jsdelivr.com/
- The property jsxLoader.babelUrl was changed and can be set back to unpkg if needed by setting the URL prior to the page being loaded.
- All example pages and apps referenced unpkg for React and related libraries.
- Even though IE is no longer supported it still works on legacy Windows Servers but unpkg blocks it from downloading CDN content. Given this fact, its possible they may block other browsers in the future so switching to jsDelivr helps avoid issues were code could break and it allows jsxLoader plus all React examples to work out of the box for IE again.
Updated several ImageGallery React and Web Components so that css @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {} would only be included if the browser is IE 11.
- Edge browser started giving a deprecation warning when using this CSS media query.
- Additionally, the main site, the playground site, and many examples were updated to dynamically handle the CSS media query for IE but not other browsers.
Fixed Unit Tests for React and Preact pages
- https://dataformsjs.com/unit-testing/react
- https://dataformsjs.com/unit-testing/preact
- http://127.0.0.1:4000/unit-testing-react
- http://127.0.0.1:4000/unit-testing-preact
- The pages were previously using the latest CDN version of Mocha and Chai; however their was a breaking change so now specific CDN versions are used rather than the latest version.
Updated Unit Tests to run from Port 4000 instead of Port 5000 because Port 5000 is now used by default on Mac for AirPlay and was causing a conflict when running tests on a Mac.

Replace all instances of the Polyfill Service https://polyfill.io/v3/polyfill.min.js? with https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0&
- This is due to a supply chain attack against the popular JS Polyfill Library and site polyfill.io.
- https://cdnjs.cloudflare.com/polyfill/
- https://www.akamai.com/blog/security/2024-polyfill-supply-chain-attack-what-to-know
- Based on how the Polyfill is loaded for DataFormsJS this error would have only affected users of IE (as of 2024 this is mainly old Windows Servers in a corporate environment).

jsxLoader Update so that JSX Files are compiled and added to the page only after all files are downloaded
- Related Issue: #22
- Previously JSX files were asynchronously download, compiled, and added to the page in the order that they downloaded.
- This caused issues when files downloaded in an unexpected order.
Special Thanks to m1sta for opening this issue and providing great examples to show the error https://github.com/m1sta

Web Components - Renamed function [utils.js].isAttachedToDom() to [utils.js].isDomAttached() because the text string ToDom would show up when searching source code for case-insensitive todo. This is a minor update but prevents the files from showing up in external projects by accident. This could be considered a breaking change if an app calls the function but that is unlikely the case and it's mostly an internal function because it's undocumented outside of the changelog; that is the reason why a patch version is being released.

Fixed a bug in Web Component <json-data> that was introduced on the previous build where format.{func} was not working in [data-show] attributes.

Added ability to use HTML Attribute [data-format] from Web Component <url-router> when using attribute [url-param]. The same functionality when using Web Component <json-data> with attribute [data-bind] is provided.
- This includes using data-format="number|date|dateTime|time|{function}" and custom functions.
- js/web-components/url-router.js https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/url-router.js
Updated Image Gallery Controls/Components:
- Fixed issue where pinch-to-zoom on mobile devices would cause previous/next image navigation to occur.
- js/web-components/image-gallery.js https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/image-gallery.js
- js/plugins/imageGallery.js https://github.com/dataformsjs/dataformsjs/blob/master/js/plugins/imageGallery.js
- js/react/es6/ImageGallery.js https://github.com/dataformsjs/dataformsjs/blob/master/js/react/es6/ImageGallery.js

Update Code Comments on React Component <JsonData>
- Previously @license was included in the main comment which resulted in Vite including about 5 kB (uncompressed) and about 1.5 kB of extra code on the build process.
- Comments were updated so that they are not included on build resulting in smaller files.
Update Framework, React, and Web Components for Date/Time formatting:
- Update for en-US to use format {date} {time} instead of {date}, {time} because most people in the US (and software programs) do not use the comma while Chrome uses the comma.

DataFormsJS App Object
- ~/js/DataFormsJS.js
- New Feature - Pass HTML Attributes as Properties to HTML Controls
  - This is similar in concept to passing props with React or Vue and allows easy and quick customization of content in the HTML control.
- Update - When manually calling app.refreshHtmlControl() nested HTML controls are now rendered
- Fix typo in error message
- Example of the new features is being published on the Handlebars Places Demo:
  - https://dataformsjs.com/examples/places-demo-hbs.htm
  - All pages with Excel and CSV export pass prop to a HTML Control
  - Search Screen renders nested HTML control when app.refreshHtmlControl() is called from the JS Control <json-data>
Web Components - Component Class
- ~/js/web-components/Component.js
- https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/Component.js
- Update so that props defined with camelCase will be available as dashed-case from HTML Observable Attributes
- Update HTML Observable Attributes to convert strings to correct type for true, false, null and empty values
- Example is being published with the Web Components Places Demo:
  - https://www.dataformsjs.com/examples/places-demo-web.htm
Framework Plugins - Excel and CSV Export
- ~/js/plugins/exportToCsv.js
- ~/js/plugins/exportToExcel.js
- Add support so that elements using the plugin are refreshed when app.refreshHtmlControl() is called.
- Minor fix handled by using onRendered(rootElement) instead of onRendered().
- For Excel text columns were the the max character width is less than 20 an extra 2 pixels of space will be added so content better fits.
I18N update
- Framework Plugin ~/js/plugins/i18n.js
- Web Component ~/js/web-components/i18n-service.js
- Added ability to find and replace i18n keys inside of an attribute string by using syntax [[key]]
  - Example data-export-file-name="[[Countries]].xlsx" data-i18n-attr="data-export-file-name"
  - Previously both Countries and Countries.xlsx would have had to be defined for each language
  - Now only Countries has to be defined
  - For Vue apps this applies to the v-i18n-attr directive

Excel Export (Web Component and Framework Plugin)
- Default data-worksheet-name to data-export-file-name excluding file extension .xlsx if the attribute is not included
- Trim spaces for text fields
- Set header style (gray fill color, bold, etc) only on the cells used rather than the entire row
CSV Export (Web Component and Framework Plugin)
- Trim spaces for text fields

Add Excel Export functionality
- Web Component:
  - ~/js/web-components/export-to-excel-service.js
  - https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/export-to-excel-service.js
- Framework Plugin:
  - ~/js/plugins/exportToExcel.js
  - https://github.com/dataformsjs/dataformsjs/blob/master/js/plugins/exportToExcel.js
- Both Web Component and Framework Plugin have the same behavior
- Exports happen directly in the browser through JavaScript and no server-side calls are made which makes the export/download appear almost instantly to the user.
- The script uses the external library ExcelJS and the first time the user exports an Excel file this service will download ExcelJS from a CDN. The generated Excel file contains a fixed header row using a gray and bold style and a filter set. The width of columns is based on the data. ExcelJS has many formatting options so if you need something similar or a custom version of this script then this file provides a good starting point for custom Excel Development.
- https://github.com/exceljs/exceljs/
Update CSV Export to export only visible rows by default
- A new HTML attribute [data-export-all] was added to always export all rows regardless of filter.
Add and updated Examples for this:
- Log Demos
  - https://dataformsjs.com/examples/log-table-vue.htm#/10
  - And all other Log demos
- New Export Table Demo - Web Components
  - https://dataformsjs.com/examples/export-table-web.htm
  - ~/examples/export-table-web.htm
  - https://github.com/dataformsjs/dataformsjs/blob/master/examples/export-table-web.htm
- New Export Table Demo - Framework
  - https://dataformsjs.com/examples/export-table-js.htm
  - ~/examples/export-table-js.htm
  - https://github.com/dataformsjs/dataformsjs/blob/master/examples/export-table-js.htm
Updated Framework dataBind plugin to bind global window.* variables for a basic webpage if not using SPA
Updated Framework Control data-table to not show an error when an empty table is displayed without data-bind

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Releases: dataformsjs/dataformsjs

DataFormsJS v5.14.5

DataFormsJS v5.14.4

DataFormsJS v5.14.3

DataFormsJS v5.14.2

DataFormsJS v5.14.1

DataFormsJS v5.14.0

DataFormsJS v5.13.1

DataFormsJS v5.13.0

DataFormsJS v5.12.1

DataFormsJS v5.12.0