Text to go in the release notes:
|
The idea behind this bug was to introduce a framework for building Vue applications and components that would allow a developer to make use of pre-existing components and logic, rather than having to write everything from scratch. Currently in Koha, we have a lot of bespoke logic for each different form/display page as well as a lot of repeated code. This can make regressions more likely and reduce code consistency. To address this, we have introduced standardised components for rendering form elements (e.g. inputs, selects) and displaying data, as well as a standardised ‘list’ component. This means that each new Vue module can be built very quickly without the need to write out all the HTML structure and logic for creating a form/display page - the developer can simply access the pre-written logic in the framework to do the heavy lifting for them.
The FormElement and ShowElement components are at the core of this work, as they render the different input and display options in a standardised manner. These are made use of by ResourceFormSave, ResourceShow and ResourceList which act as generic components that can be used by the developer to handle any Koha data type. To prove this, all the existing Vue modules (ERM, Preservation, Record Resources and Vendors) have been migrated to use it. A new suite of cypress tests has been written to verify the functionality as well as catch regressions and part of this is introducing component testing into Koha for any future Vue work that may need it.
Moving forwards, the aim would be that new modules are built using this framework. It is important to note that the framework is not restrictive - it is possible to inject bespoke components directly into FormElement and ShowElement where there are particularly niche requirements. However, the goal is that if the developer feels that there could be a need for that requirement in future for someone else, then the goal should be to expand the framework to support it so that all can benefit. We have documented this through the use of JSDoc in base-resource.js, as well as with an example SkeletonResource.vue to show how it should be used. There are also the live examples in the modules mentioned above.
|