JavaScript error: RangeError: invalid value unit for option style #11459

d0da95b8c6/src/duration-format-ponyfill.ts (L113)

@wxiaoguang commented on GitHub (Aug 15, 2023):

The exception is thrown here:

~~What's your browser name/version~~ and what's your locale (eg: run window.document.documentElement.lang in your browser console)?

(Hmm, I see Browser: Pale Moon 32.3.1, maybe it's a browser's bug)

And, are you using some browser plugins like translators? Does the error still exist in private window?

@wxiaoguang commented on GitHub (Aug 15, 2023): The exception is thrown here: https://github.com/github/relative-time-element/blob/d0da95b8c69bd22b76781d50d6143f7427844380/src/duration-format-ponyfill.ts#L113 ~~What's your browser name/version~~ and what's your locale (eg: run `window.document.documentElement.lang` in your browser console)? (Hmm, I see Browser: Pale Moon 32.3.1, maybe it's a browser's bug) And, are you using some browser plugins like translators? Does the error still exist in private window?

GiteaMirror commented

@wxiaoguang commented on GitHub (Aug 16, 2023):

PaleMoon bug (incomplete Intl.NumberFormat support).

You could test it on this page https://github.github.io/relative-time-element/examples/ and fix the bug accordingly.

@wxiaoguang commented on GitHub (Aug 16, 2023): PaleMoon bug (incomplete `Intl.NumberFormat` support). You could test it on this page https://github.github.io/relative-time-element/examples/ and fix the bug accordingly. ![image](https://github.com/go-gitea/gitea/assets/2114189/5fa5a3d5-4651-4117-9198-b1d40a1bd42f)

GiteaMirror commented

https://repo.palemoon.org/MoonchildProductions/Pale-Moon/issues/1930

@veita commented on GitHub (Aug 16, 2023):

@veita commented on GitHub (Aug 16, 2023): https://repo.palemoon.org/MoonchildProductions/Pale-Moon/issues/1930

GiteaMirror commented

@wolfbeast commented on GitHub (Aug 18, 2023):

It's not necessarily a "bug", it's just "yet another spec change" and "yet another tacked on API". We did lift our Intl support to the proper level recently, however we do not yet support the so-called Unified NumberFormat API which Gitea apparently now wants to use. i.e. not a bug, just another feature we'll have to implement.

Couldn't this have been implemented a bit more browser-agnostic in Gitea? I mean, not like "relative date formats" are a new thing, at all.

@wolfbeast commented on GitHub (Aug 18, 2023): It's not necessarily a "bug", it's just "yet another spec change" and "yet another tacked on API". We did lift our `Intl` support to the proper level recently, however we do not yet support the so-called `Unified NumberFormat API` which Gitea apparently now wants to use. i.e. not a bug, just another feature we'll have to implement. Couldn't this have been implemented a bit more browser-agnostic in Gitea? I mean, not like "relative date formats" are a new thing, at all.

GiteaMirror commented

@wxiaoguang commented on GitHub (Aug 18, 2023):

Before 1.20: the "relative date" is rendered by backend, it doesn't support i18n well.

1.20: by using GitHub's "relative-time" element (#23988) , most date/time/duration texts are rendered by browser.

@wxiaoguang commented on GitHub (Aug 18, 2023): Before 1.20: the "relative date" is rendered by backend, it doesn't support i18n well. 1.20: by using GitHub's "relative-time" element (#23988) , most date/time/duration texts are rendered by browser. * https://github.com/github/relative-time-element * https://github.github.io/relative-time-element/examples/

GiteaMirror commented

@wolfbeast commented on GitHub (Aug 18, 2023):

Would you consider keeping the backend implementation as a fallback, at least? I mean, just hard throwing an error is always worse than "not supporting i18n well".

(as an aside, GitHub has indicated they want to always be on the bleeding edge of new client APIs, so using that as a reference for "what to implement" may not always be a good idea...)

@wolfbeast commented on GitHub (Aug 18, 2023): Would you consider keeping the backend implementation as a fallback, at least? I mean, just hard throwing an error is always worse than "not supporting i18n well". (as an aside, GitHub has indicated they want to always be on the bleeding edge of new client APIs, so using that as a reference for "what to implement" may not always be a good idea...)

GiteaMirror commented

@wxiaoguang commented on GitHub (Aug 18, 2023):

I am neutral for it, but I am not familiar with the "relative-time" change. Maybe the original author @yardenshoham could suggest.

@wxiaoguang commented on GitHub (Aug 18, 2023): I am neutral for it, but I am not familiar with the "relative-time" change. Maybe the original author @yardenshoham could suggest.

GiteaMirror commented

@wolfbeast commented on GitHub (Aug 18, 2023):

For the record, GitHub's relative duration implementation does seem to render correctly in Pale Moon.

@wolfbeast commented on GitHub (Aug 18, 2023): For the record, GitHub's relative duration implementation does seem to render correctly in Pale Moon.

GiteaMirror commented

@wxiaoguang commented on GitHub (Aug 18, 2023):

Maybe they use some internal packages or they use some polyfill packages.

@wxiaoguang commented on GitHub (Aug 18, 2023): Maybe they use some internal packages or they use some polyfill packages.

GiteaMirror commented

@yardenshoham commented on GitHub (Aug 18, 2023):

Perhaps we could add some sort of polyfill for the missing NumberFormat API? I see a backend implementation as a step back in terms of evolution

@yardenshoham commented on GitHub (Aug 18, 2023): Perhaps we could add some sort of polyfill for the missing NumberFormat API? I see a backend implementation as a step back in terms of evolution

GiteaMirror commented

@wxiaoguang commented on GitHub (Aug 18, 2023):

Just get an (somewhat strange) idea, would PaleMoon like to pack some polyfill packages by default? Then many browser features could be used out-of-box, instead of waiting for a C++ native implemention. 😁

@wxiaoguang commented on GitHub (Aug 18, 2023): Just get an (somewhat strange) idea, would PaleMoon like to pack some polyfill packages by default? Then many browser features could be used out-of-box, instead of waiting for a C++ native implemention. 😁

GiteaMirror commented

@wolfbeast commented on GitHub (Aug 18, 2023):

Just get an (somewhat strange) idea, would PaleMoon like to pack some polyfill packages by default?

That's rather complex and potentially dangerous as we can't just inject scripts into content willy-nilly, especially not if they are part of the browser's internal resources (it breaks the chrome/content boundary); on top, blanked polyfilling will conflict with other websites that may polyfill things themselves. In isolation it might be a good idea but not on the open web, unfortunately. We have an open issue to implement this API now, but no immediate timeline as to when we'll get to it.

@wolfbeast commented on GitHub (Aug 18, 2023): > Just get an (somewhat strange) idea, would PaleMoon like to pack some polyfill packages by default? That's rather complex and potentially dangerous as we can't just inject scripts into content willy-nilly, especially not if they are part of the browser's internal resources (it breaks the chrome/content boundary); on top, blanked polyfilling will conflict with other websites that may polyfill things themselves. In isolation it might be a good idea but not on the open web, unfortunately. We have an open issue to implement this API now, but no immediate timeline as to when we'll get to it.

GiteaMirror commented

@wxiaoguang commented on GitHub (Aug 18, 2023):

Made some tests, the minimal polyfill is like this (without i18n support):

	(function() {
		const old = Intl.NumberFormat;
		Intl.NumberFormat = function(locales, options) {
			if (options.style === 'unit') {
				return {
					format: function(value) {
						return ` ${value} ${options.unit}`;
					}
				}
			}
			return old(locales, options);
		};
	})();

@wxiaoguang commented on GitHub (Aug 18, 2023): Made some tests, the minimal polyfill is like this (without i18n support): ``` (function() { const old = Intl.NumberFormat; Intl.NumberFormat = function(locales, options) { if (options.style === 'unit') { return { format: function(value) { return ` ${value} ${options.unit}`; } } } return old(locales, options); }; })(); ``` ![image](https://github.com/go-gitea/gitea/assets/2114189/7cc4c2ef-2fec-4065-9174-e07c45825b13)

GiteaMirror commented