Bug 32212 - Add separate Bootstrap 4 node module for the OPAC
Summary: Add separate Bootstrap 4 node module for the OPAC
Status: CLOSED FIXED
Alias: None
Product: Koha
Classification: Unclassified
Component: Templates (show other bugs)
Version: master
Hardware: All All
: P5 - low major (vote)
Assignee: Owen Leonard
QA Contact: Testopia
URL:
Keywords:
Depends on: 32030
Blocks: 25267
  Show dependency treegraph
 
Reported: 2022-11-15 15:57 UTC by Owen Leonard
Modified: 2023-06-08 22:28 UTC (History)
4 users (show)

See Also:
Change sponsored?: ---
Patch complexity: Trivial patch
Documentation contact:
Documentation submission:
Text to go in the release notes:
Version(s) released in:
22.11.00


Attachments
Bug 32212: Add separate Bootstrap 4 node module for the OPAC (6.21 KB, patch)
2022-11-15 19:04 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 32212: Add separate Bootstrap 4 node module for the OPAC (6.26 KB, patch)
2022-11-15 19:20 UTC, David Nind
Details | Diff | Splinter Review
Bug 32212: (bug 32030 follow-up) Restore bootstrap 4 (1.12 KB, patch)
2022-11-17 06:56 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 32212: (bug 32030 follow-up) Restore bootstrap 4 (1.17 KB, patch)
2022-11-17 12:30 UTC, David Nind
Details | Diff | Splinter Review
Bug 32212: (bug 32030 follow-up) Restore bootstrap 4 (1.22 KB, patch)
2022-11-17 17:50 UTC, Tomás Cohen Arazi
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Owen Leonard 2022-11-15 15:57:37 UTC
Bug 32030 - Electronic resource management - updated the Bootstrap node module to 5.2.x, but the OPAC still needs a copy of Bootstrap 4.
Comment 1 Owen Leonard 2022-11-15 19:04:44 UTC
Created attachment 143924 [details] [review]
Bug 32212: Add separate Bootstrap 4 node module for the OPAC

This patch updates package.json so that Bootstrap 4 will be installed
alongside Bootstrap 5. The addition of ERM changed the installed version
of Bootstrap to 5.2.x but the OPAC still requires 4.x.

To test, apply the patch and run 'yarn install.'

After packages install, run 'yarn build --view opac'

The build process should complete correctly and the OPAC should look the
same as before.
Comment 2 David Nind 2022-11-15 19:20:57 UTC
Created attachment 143925 [details] [review]
Bug 32212: Add separate Bootstrap 4 node module for the OPAC

This patch updates package.json so that Bootstrap 4 will be installed
alongside Bootstrap 5. The addition of ERM changed the installed version
of Bootstrap to 5.2.x but the OPAC still requires 4.x.

To test, apply the patch and run 'yarn install.'

After packages install, run 'yarn build --view opac'

The build process should complete correctly and the OPAC should look the
same as before.

Signed-off-by: David Nind <david@davidnind.com>
Comment 3 David Nind 2022-11-15 19:23:34 UTC
Testing notes:

- I had a brief roam around the OPAC, everything looked OK and I didn't notice anything that was different.
Comment 4 David Cook 2022-11-15 22:44:54 UTC
Anything particular to look for in this one?

Is something clearly broken without it which is fixed with it?
Comment 5 David Nind 2022-11-15 23:03:45 UTC
(In reply to David Cook from comment #4)
> Anything particular to look for in this one?
> 
> Is something clearly broken without it which is fixed with it?

See bug 25267 - without this, you can't rebuild the CSS for the OPAC.

So, before applying the patch:
1. yarn install
2. yarn build --view opac
3. Result - you get an error:

yarn build --view opac
yarn run v1.22.19
$ node_modules/.bin/gulp build --view opac
[22:33:59] Using gulpfile /kohadevbox/koha/gulpfile.js
[22:33:59] Starting 'build'...
Error in plugin 'sass'
Message:
    koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss
Error: File to import not found or unreadable: ../../../../../node_modules/bootstrap/scss/custom-forms.
        on line 52 of koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss
        from line 1 of koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
>> @import "../../../../../node_modules/bootstrap/scss/custom-forms";

   ^

[22:33:59] Finished 'build' after 91 ms
Done in 2.42s.

4. Apply the patch.
5. Repeat steps 1 and 2.
6. Result - OPAC CSS is rebuilt successfully without any errors.

Also, see the discussion on IRC http://irc.koha-community.org/koha/2022-11-15#i_2462075
Comment 6 Jonathan Druart 2022-11-16 05:59:57 UTC
I am sorry, this is a mistake, we should not have the version bump. We are finally not using bootstrap 5 for ERM, see commit "Bug 32030: ERM - Remove BootstrapVue3"
Comment 7 Jonathan Druart 2022-11-16 06:01:40 UTC
We could go with your patch or remove
  "bootstrap-vue-3": "^0.1.7",
and adjust the bootstrap version.
Comment 8 Owen Leonard 2022-11-16 11:41:24 UTC
I think removing Bootstrap 5 is the right thing to do, if we don't need it.
Comment 9 Jonathan Druart 2022-11-17 06:56:40 UTC
Created attachment 143981 [details] [review]
Bug 32212: (bug 32030 follow-up) Restore bootstrap 4

During the development of the eRM module I've tried to use bootstrap 5
(and vue-bootstrap), but I didn't manage to make it work without
modifying the version used in Koha. This change is actually not needed
and we can keep version 4.
See commit 8c32f186d5a62e742621c35cfacff5b22bb42b71
Bug 32030: ERM - Remove BootstrapVue3

Test plan:
% yarn install
% git diff
you should notice the version change in yarn.lock
Comment 10 David Nind 2022-11-17 12:30:50 UTC
Created attachment 143995 [details] [review]
Bug 32212: (bug 32030 follow-up) Restore bootstrap 4

During the development of the eRM module I've tried to use bootstrap 5
(and vue-bootstrap), but I didn't manage to make it work without
modifying the version used in Koha. This change is actually not needed
and we can keep version 4.
See commit 8c32f186d5a62e742621c35cfacff5b22bb42b71
Bug 32030: ERM - Remove BootstrapVue3

Test plan:
% yarn install
% git diff
you should notice the version change in yarn.lock

Signed-off-by: David Nind <david@davidnind.com>
Comment 11 David Nind 2022-11-17 12:32:26 UTC
Testing notes (using KTD):

1. Can now rebuild OPAC CSS.

2. There are two warnings when running yarn install - not sure whether these need to be addressed or not:

yarn install
yarn install v1.22.19
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
warning " > bootstrap@4.6.2" has unmet peer dependency "jquery@1.9.1 - 3".
warning " > bootstrap@4.6.2" has unmet peer dependency "popper.js@^1.16.1".
[4/4] Building fresh packages...
success Saved lockfile.
Done in 6.43s.
Comment 12 Tomás Cohen Arazi 2022-11-17 17:50:30 UTC
Created attachment 144019 [details] [review]
Bug 32212: (bug 32030 follow-up) Restore bootstrap 4

During the development of the eRM module I've tried to use bootstrap 5
(and vue-bootstrap), but I didn't manage to make it work without
modifying the version used in Koha. This change is actually not needed
and we can keep version 4.
See commit 8c32f186d5a62e742621c35cfacff5b22bb42b71
Bug 32030: ERM - Remove BootstrapVue3

Test plan:
% yarn install
% git diff
you should notice the version change in yarn.lock

Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
Comment 13 Tomás Cohen Arazi 2022-11-17 18:04:52 UTC
Pushed to master for 22.11.

Nice work everyone, thanks!