AtoM 2.7 - unexpected result after activating the arDominionB5Plugin theme

[Jim Adamson]

Hello,

I'd like to take an initial look at the new BootStrap 5 Dominion theme, but am seeing an issue with it:

• If I clean-install AtoM 2.7 (atom-2.7.0.tar.gz) in an Ubuntu 20.04 vagrant box, and set the theme to arDominionB5Plugin via Admin > Themes, I see a CSS-less, unstyled version of the site. In browser DevTools, I see some failed requests:

• If I clean-install AtoM 2.7 (from GitHub, stable/2.7.x branch) in an Ubuntu 20.04 vagrant box, and set the theme to arDominionB5Plugin via Admin > Themes, I see an The template "_layout_start.php" does not exist or is unreadable in "". error page:
  

In both cases the older BS 2 themes work normally.

I've had a look at https://www.accesstomemory.org/en/docs/2.7/user-manual/administer/themes/ to see if there's extra steps to get it working — an equivalent to running make from the BS2 theme directory — but apparently not.

I'm using a bash script to install AtoM, which keeps everything "vanilla" and sticks closely to the official 2.7 instructions.

Thanks in advance for any tips.

Thanks, Jim

--

Jim Adamson

Systems Administrator/Developer
Facilities Management Systems
IT Services

LFA/023 | Harry Fairhurst building | University of York | Heslington | York | YO10 5DD

+44 (0)1904 323859

Email disclaimer: https://www.york.ac.uk/about/legal-statements/email-disclaimer/

[José Raddaoui]

Hi Jim,

It looks like the dist folder was not included in the tarball and that the installation docs are missing the new NPM steps to build the Bootstrap 5 theme. For the Github install, you'll need to install Node 16.x or higher + NPM and, from the AtoM folder, execute:

npm install

npm run build

rm -rf node_modules

Make sure you run that with the AtoM/Nginx user or that you fix the permissions after. I hope that helps and sorry for the troubles, we'll update the documentation soon to reflect this changes but I'm not sure what would be the next step for the tarball yet.

Best,

Radda.

[Jim Adamson]

Thanks very much, Radda! I shall give those steps a go.

Thanks, Jim

--
You received this message because you are subscribed to the Google Groups "AtoM Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to ica-atom-user...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/ica-atom-users/51d167e4-53fc-4745-bb54-69c81b376948n%40googlegroups.com.

[Jim Adamson]

Hi Radda,

Just to confirm those extra steps solved the problem with the GitHub installation. Thank you very much.

Great work on the new theme! A big improvement.

Thanks, Jim

[Dan Gillean]

Thanks for letting us know, Jim!

Upgrading to Bootstrap 5 has been a HUGE project that will be continued to be refined through this major release cycle. We had to essentially make new versions of every template in AtoM for the BS5 theme, while still ensuring that all BS2 templates still work so that users with custom themes have  a whole major release cycle to get caught up on the changes and upgrade their themes to BS5 in advance of 2.8 (when we currently intend to remove BS2 support). 

Consequently, we put a ton of time into testing the BS2 templates to make sure they work as expected - but to avoid even more release delays, a bit less effort in testing coverage with the new BS5 templates. Instead, we are hoping that users like yourself will let us know of any issues you find - especially if they seem particular to the BS5 templates - and we will address those incrementally in point releases. So please let us know how it goes! 

Over time we also intend to prepare further documentation and examples for BS5 theming, to help our user community with the upgrade. 

Cheers, 

Dan Gillean, MAS, MLIS
AtoM Program Manager
Artefactual Systems, Inc.
604-527-2056

@accesstomemory

he / him

To view this discussion on the web visit https://groups.google.com/d/msgid/ica-atom-users/CAEz_m%3DRFeCXfxMzC0%2BeLj3X%2BV7p9DdxXws%3Dmge5vcrCxtTPnhg%40mail.gmail.com.

[Jim Adamson]

Hi Dan,

I appreciate all the effort that went into this, and I will certainly provide feedback as and when issues arise! We're currently using a lightly-customised version of the arDominion BS2 theme, and I'll be working on redoing those customisations on top of the new BS5 theme in the near future. I know that colleagues are extremely interested in accessibility improvements to the York AtoM instance, so I'm sure they'll be on board with the change. From a quick look, the new theme looks very nice on mobile too!

Thanks, Jim

To view this discussion on the web visit https://groups.google.com/d/msgid/ica-atom-users/CAC1FhZLjK46p%2B%3D4p9h8jEHAyhoQO6_xnYSQyzbKsXE%2BrKLSq1A%40mail.gmail.com.

[Jim Adamson]

Hi Dan, Radda,

This is a follow-on to my earlier message about getting started with the new BS5 Dominion theme. A few weeks back when I first started testing the GitHub method, I installed NodeJS 19.x (latest version) and didn't have any problems running the prerequisite npm commands mentioned by Radda. Then I looked at the NodeJS release schedule and concluded that it'd be best to install NodeJS 18.x LTS, as it's LTS with support until 2025-04-30. Non-LTS NodeJS 19.x is fine in testing, but later down the line, in production environments, my thinking is that it would be best to avoid short-term releases.

So I've been doing further testing with the stable/2.7.x branch, NodeJS 18.x LTS, and running the npm commands. I installed 18.x successfully but noticed that after running 'npm install' I would see a 'Cypress cannot write to the cache directory due to file permissions' error (†), even when running as root. I believe this is something to do with npm determining the ownership of /usr/share/nginx/atom and then attempting to run as the directory owner (www-data) which doesn't then have access to /root/.cache/Cypress.

Anyway, I have concocted a workaround, which is to pass the HOME and CYPRESS_CACHE_FOLDER variables directly to npm:

cd /usr/share/nginx/atom
HOME="$(echo ~www-data)" CYPRESS_CACHE_FOLDER="cypress_cache" npm install
# Fix 'sh: 1: webpack: Permission denied'
chmod +x /usr/share/nginx/atom/node_modules/webpack/bin/webpack.js
HOME="$(echo ~www-data)" CYPRESS_CACHE_FOLDER="cypress_cache" npm run build

rm -rf node_modules

An aside - there is another small fix in there to set executable permissions on webpack.js

† Full error lines below:

root@ubuntu-focal:/usr/share/nginx/atom#npm install

npm ERR! code 1
npm ERR! path /usr/share/nginx/atom/node_modules/cypress
npm ERR! command failed
npm ERR! command sh -c -- node index.js --exec install
npm ERR! Cypress cannot write to the cache directory due to file permissions
npm ERR!
npm ERR! See discussion and possible solutions at
npm ERR! https://github.com/cypress-io/cypress/issues/1281
npm ERR!
npm ERR! ----------
npm ERR!
npm ERR! Failed to access /root/.cache/Cypress:
npm ERR!
npm ERR! EACCES: permission denied, mkdir '/root/.cache/Cypress'
npm ERR!
npm ERR! ----------
npm ERR!
npm ERR! Platform: linux-x64 (Ubuntu - 20.04)
npm ERR! Cypress Version: 10.3.0

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2023-01-11T12_10_44_909Z-debug-0.log

Just thought I'd mention this, as others testing the BS5 theme may well hit the same problem.

I've updated my bash script to include the fixes mentioned here.

In addition, I see that the AtoM 2.7 / Ubuntu 20.04 installation instructions now includes steps for getting the BS5 theme working, but relies on the Ubuntu supplied version of npm, version 6.14.4 (no curl -fsSL https://deb.nodesource.com/setup_18.x | bash - && apt install -y nodejs line or equivalent exists in the instructions)

When I tested the Ubuntu supplied version of npm, I saw the following warning/errors:

root@ubuntu-focal:/usr/share/nginx/atom#npm install
npm WARN read-shrinkwrap This version of npm is compatible with lockfileVersion@1, but package-lock.json was generated for lockfileVersion@2. I'll try to do my best with it!
npm ERR! code EBADPLATFORM
npm ERR! notsup Unsupported platform for fsev...@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm ERR! notsup Valid OS:    darwin
npm ERR! notsup Valid Arch:  any
npm ERR! notsup Actual OS:   linux
npm ERR! notsup Actual Arch: x64

npm ERR! A complete log of this run can be found in:

npm ERR!      /root/.npm/_logs/2023-01-18T16_17_02_551Z-debug.log

I hope my findings are useful!

Thanks, Jim

[José Raddaoui]

Hi Jim,

Glad you found a solution to the issues and thanks for sharing it. A few comments and other options:

- A new tarball has been created (v2.7.1) which include the BS5 theme assets already, I'd suggest to use that for production to avoid installing NPM and Composer to manage the Node and PHP dependencies.

- The install docs for Github use n to manage the NPM version, running `sudo n stable` I get Node v18.13.0 at the moment.

- We never had to add the executable permission on the webpack dependency at node_modules, maybe it's related to the other permission issues?

- Cypress is only used to run e2e tests, so you could skip its binary installation setting the CYPRESS_INSTALL_BINARY env var to 0, maybe that solves the cache folder permissions issue too?

Again, thanks for posting your findings.

Best,

Radda. 

[Jim Adamson]

Hi Radda,

Thanks for your reply.

Just to explain why we're planning on using the GitHub version in production:

We're possibly in a minority of AtoM users in so much as we have made quite a few customisations to PHP files and other files, and use a custom theme. Currently we use the tarball version of AtoM 2.6.4 in production, with all the customisations being managed/deployed using Puppet. This works okay, however, I'd like to move away from managing our customisations in this way. To support this change, I have forked the artefactual/atom GitHub repo and applied our customisations on top. I have also added our custom theme as a git submodule (our theme was already in GitHub). This way, when our new production VM is first provisioned by Puppet, Puppet will bring down the forked repo. Puppet will no longer need to to overwrite the vanilla PHP files with our customisations, and won't need to get our theme as a separate task. It also keeps our code customisations closer to the codebase, making it easier to manage across AtoM versions (well, that's the theory anyway!).

I'm sorry, I didn't spot the line in the instructions that installed n. 😊 I can see it clearly now!

The webpack executable permission is probably peculiar to the way I've installed it, i.e. using the nodesource repo and apt - though I'm fairly certain it cropped up consistently, after a handful of Vagrant halt/destroy/up occasions.

I'll certainly take a look at using CYPRESS_INSTALL_BINARY=0 - that would simplify things!

Thanks, Jim

To view this discussion on the web visit https://groups.google.com/d/msgid/ica-atom-users/40ed33f7-d3f0-49bd-a6d2-4d9fccb3c58dn%40googlegroups.com.