search

NASA-PDS / doi-ui

The web interface for the PDS DOI Service providing the ability management PDS archive DOIs. See the DOI Service for more details on the available capabilities. https://nasa-pds.github.io/doi-service/
Apache License 2.0
0 stars 4 forks source link

doi-editor release ui inoperable under Firefox #167

Closed alexdunnjpl closed 1 year ago

alexdunnjpl commented 1 year ago

🐛 Describe the bug

When attempting to release one of the DOIs listed at https://pds-gamma.jpl.nasa.gov/tools/doi-editor/#/release/urn:nasa:pds:insight_cameras::1.0, the resulting page of the app shows an "API Unreachable" error banner and is inoperable.

This is specific to Firefox - the webapp works correctly under safari and chrome

📜 To Reproduce

Steps to reproduce the behavior:

  1. Navigate to https://pds-gamma.jpl.nasa.gov/tools/doi-editor/#/release/urn:nasa:pds:insight_cameras::1.0
  2. Click on "RELEASE" for one of the DOIs

🕵️ Expected behavior

@jordanpadams is Firefox intended to be supported? If so, the app should be made compatible. If not, I'd suggest detection of FF clients, and a corresponding warning be shown instead of the current page with error.

📚 Version of Software Used

pds-dio-ui==1.0.1 firefox==106.0.3 (64-bit)

jordanpadams commented 1 year ago

@eddiesarevalo @anilnatha do we know of a tool we can use in order to effectively test all browsers for web apps? some folks at RMS mentioned a tool a while back for this, but not sure if you know of others or could ask around in your group.

@c-suh should probably be looped in here too.

alexdunnjpl commented 1 year ago

@jordanpadams Selenium?

There's a learning curve for the full feature set, but the tool's really tight and shouldn't be onerous to ramp up on if we're wanting to get basic tests going.

You can pretty-much code up a UI story/flow directly into a set of HTML element interactions and synchronous waits, and assert stuff as you go, then run it against each browser.

eddiesarevalo commented 1 year ago

The bug that caused a crash on Firefox is fixable by adding the version number to the XSL stylesheet. Firefox is more strict about this than Chrome or Safari. <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

https://github.com/NASA-PDS/doi-ui/blob/main/src/utils/xmlUtil.js

It turns out even by fixing this, the <xsl:output indent="yes"/>' tag doesn't work on Firefox so that the styling will still look jumbled on Firefox.

On Firefox: Screen Shot 2022-12-05 at 3.47.43 PM.png

On Chrome:Screen Shot 2022-12-05 at 3.47.29 PM.png

If we want to support firefox we should get rid of the XSL logic and use something off of npm like https://github.com/riversun/xml-beautify

tloubrieu-jpl commented 1 year ago

@eddiesarevalo can test the new styler, if that does not work will keep it as is with the bug fix on the xml.

eddiesarevalo commented 1 year ago

Used a different formatter so it looks formatted in Firefox and Chrome:

Screen Shot 2022-12-20 at 8 53 35 AM
tloubrieu-jpl commented 1 year ago

cannot be tested because of https://github.com/NASA-PDS/doi-ui/issues/178