metal / metal-plugins Goto Github PK
View Code? Open in Web Editor NEWA collection of utilities that are often used in Metal.js projects, such as Ajax, Promise, URI, etc
License: Other
A collection of utilities that are often used in Metal.js projects, such as Ajax, Promise, URI, etc
License: Other
We're currently now auto-escaping html text content or attributes, so user-generated content can easily produce malicious content when rendering using incremental-dom-string
on the server.
https://github.com/metal/metal-plugins/blob/master/packages/metal-drag-drop/src/Drag.js#L727
When a string is received as selector, this method manually appends a :not([aria-grabbed="true"])
suffix.
This works for simple selectors like div
or .target
, but may have undesirable results with selectors like .target-a, .target-b
or event .target
(with a whitespace).
When calling removeAllListener, DragHandler could be null leading to below stacktrace exception:
Uncaught TypeError: Cannot read properties of null (reading 'removeAllListeners')
at DragDrop.cleanUpAfterDragging_
at DragDrop.cleanUpAfterDragging_
at DragDrop.handleDragEndEvent_
When handling Drag event of metal-drag-drop, we can't access the original event properties, such as mouse position.
Once you set a draggable element with metal-drag-drop, there is no way to make it clickable without using a handler.
Please see LPS-130077 for more details.
Copied from metal/metal.js#382 by @antonio-ortega
Hi,
User Agent is not being detected for any browser in version 2.2.0. It is working properly if I downgrade the package to 2.1.3.
As far as I know, it looks like the changes introduced here are the root cause of this issue, since we were assigning window to UA.globals.window and now we're assigning window to UA.globals.
Thanks,
Is there any reason why https://github.com/metal/metal-scrollspy isn't here?
Found in this LPS: https://issues.liferay.com/browse/LPS-92127
Metal autoScroll only works when objects move out of the document.
I tried to reproduce with just Senna.js and was unable to reproduce, so I think it is specific to metal-router.
Reproduction Steps
window.onbeforeunload = () => true
Expected Result
Browser prompts a warning that asks before going back
Actual Result
Does not navigate, JS error metal.js:9173 Uncaught TypeError: event.preventDefault is not a function
Copied from deprecate/metal-router#14 by @AngeloYoun
It is a common use case where a site structure needs to have nested routing.
Currently, only the top level URL routes can be routed via metal-router. It would be useful to be able to do something along the lines of:
<Router component={SomeComponent} path={some/path/:param1} />
...
class SomeComponent extends JSXComponent {
render() {
return {
<div class="wrapper">
<HeaderComponent />
<Router component={FooComponent} path={some/path/:param1/view1} />
<Router component={BarComponent} path={some/path/:param1/view2} />
</div>
}
}
}
Some additional information about this: jsdom/jsdom#2304.
This is affecting magnet that was forced to lock their jsdom version
We should look into updating our check, so it will report that localStorage is not available even when this version of JDOM is loaded.
@diegonvs, could you take a look at this?
/cc @ipeychev
Now that there is an official spec for promises, this polyfill should match those specs, so errors do not occur when the metal-promise is not being applied.
For example, this method could be aliased to a finally method (or the other way around):
https://github.com/metal/metal-plugins/blob/master/packages/metal-promise/src/CancellablePromise.js#L647
Promise specification: https://tc39.github.io/ecma262/#sec-properties-of-the-promise-prototype-object
We are facing a problem when using the metal-uri
component because of this:
https://github.com/metal/metal-plugins/blob/master/packages/metal-uri/src/Uri.js#L467
We saw that you are replacing it because of a library, but is it really necessary?
In short, if a user email contains a +
, it breaks all our API requests related to user updating since the uriDecode
is replacing the +
sign with a blank space.
Here goes a reproducible code of the issue we're facing:
test-uri-issue.zip
Is there any reason why https://github.com/metal/metal-useragent isn't here?
Importing a polyfill directly doesn't seem like a good solution, especially when we can implement this function without the spread operator. (And in anycase the transpiler should take care of this not us)
The current version looks like this:
function debounce(fn, delay) {
return function debounced() {
let args = arguments;
cancelDebounce(debounced);
debounced.id = setTimeout(function() {
fn(...(null, args));
}, delay);
};
}
And it can be re-written like this:
function debounce(fn, delay) {
return function debounced() {
let args = Array.prototype.slice.call(arguments, 0);
cancelDebounce(debounced);
debounced.id = setTimeout(function() {
fn.apply(null, args);
}, delay);
};
}
NOTE: I'm aware that using apply
is not considered a good practise when using ES6+ by some, but neither is using arguments
so at this point does it really matter?
That being said, once the format task kicks in (pretter-eslint
) the snippet above gets transformed (before it gets transpiled) to:
function debounce(fn, delay) {
return function debounced() {
let args = Array.prototype.slice.call(arguments, 0);
cancelDebounce(debounced);
debounced.id = setTimeout(function() {
fn(...args); // 👈no more apply, spread is here again
}, delay);
};
}
Which gets transpiled to:
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } } // 👈Array.from is expected to be available, which is not the case in IE so how do we solve this?
function debounce(fn, delay) {
return function debounced() {
var args = Array.prototype.slice.call(arguments, 0);
cancelDebounce(debounced);
debounced.id = setTimeout(function () {
fn.apply(undefined, _toConsumableArray(args));
}, delay);
};
}
This is probably because our .eslintrc
extends eslint-config-liferay
which extends eslint-config-google
which has
'prefer-rest-params': 2,
'prefer-spread': 2
Which does actually change apply
for spread.
If any one has an idea on how to solve this without changing our config or massive changes, I'd appreciate your feedback.
Thanks
Copied from deprecate/metal-router#24 by @mthadley
Hey everyone, I wanted to throw out a quick idea that may reduce some of the boilerplate when defining our routes.
It's pretty common to define a route like this, possibly many times, that is meant to match some kind of number
:
<Route
component={userPage}
path="user/:id(\d+)/"
/>
After a while, it get's tedious to add these regexes to our routes, and also reduces readability. Maybe instead we could still allow for a regex, but also provide some default "types":
<Route
component={userPage}
path="user/:id<number>/"
/>
The syntax is subject to change, but I think it would at least be useful for parsing numbers. Possible other things like booleans as well.
Thanks!
As we've moved all these packages, we should update the repository field in their package.json
files so they can be properly located from the npm page.
For instance:
If you add .only
on https://github.com/metal/metal-plugins/blob/master/packages/metal-router/test/Router.js#L691
It throws an error:
LOG: 'Senna was not initialized from data attributes. In order to enable its usage from data attributes try setting in the base element, e.g. `<body data-senna>`.'
Chrome 63.0.3239 (Mac OS X 10.13.2) ERROR
Some of your tests did a full page reload!
Chrome 63.0.3239 (Mac OS X 10.13.2): Executed 0 of 59 ERROR (0.002 secs / 0 secs)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] test: `karma start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] test script.
When running all the tests without .only
it works.
Copied from deprecate/metal-uri#32 by @diegonvs
When i get an array as a parameter with a null element inside her, instead of receiving this array containing this element as of null I get type string as the example below.
I am using metal-drag-drop in a a list of divs that I want to reorder, so in this particular case, sources are also targets.
As I am using Drag.Placeholder.CLONE as placeholder, at the moment of start dragging, this placeholder is added to the target list, and it sometimes causes problems because the placeholder targets itself.
Would it be possible to prevent the placeholder to be added to the target list in this particular case that sources are also targets?
Thanks in advance!
From deprecate/metal-position#4 by @kienD
It would be useful to be able to specify the size of the space you would like between the element and alignElement for the Align.getAlignRegion
method.
I think this could be done by adding a parameter that accepts a number value to the Align.getAlignRegion
method for the spacing size and then add or subtract the value of the spacing parameter to the values in each of the switch statements.
The parameter will probably need to be added to other methods that use Align.getAlignRegion
like Align.align
as well.
We are using DragDrop class with a miller-columns structure (this thing: https://i.stack.imgur.com/86J6J.png). For this purpose we are using metal-drag-drop autoScroll feature, but when an horizontal scroll is done, it looks that metal-drag-drop is not taking that scroll into account: it emits hover events for incorrect items.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.