Develop Reference

JS click event notation

I'm working through some code a previous developer has written and have came across the following notation:
'.js-enter-new-address click'() {}
The code works but I dont understand why. Can anyone point me to any documentation of how this works? as i've not come across js written in this form before. I would usually expect it to be:
$('.js-enter-new-address').on('click', function(event) {}
Update
I've noticed this code is part of the following, Please see below:
const deliveryAddressComponent = Component.create('.checkout-delivery-address', {
'.js-enter-new-address click'() {},
});

Its part of a javascript object that is send as a parameter of the create function of the Component object.
I don't know what this Component is or does since it's not native js.
Although the definition of the javascript object parameter seems weird it does seem to work as you can see in the snippet below.
var obj = {
'.js-enter-new-address click'() {},
}
console.log(obj);

How do I get a list of all GlobalEventHandlers?

https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers
How do I get a list of all the properties of GlobalEventHandlers?
Specifically, I want to test if a passed string is a property of GlobalEventHandlers, something like:
console.log(GlobalEventHandlers.includes('onClick')); // true
console.log(GlobalEventHandlers.includes('fizzBuzz')); // false

The only real way to get all of them is to build the list yourself, but you can loop over the keys in the window object and look for keys that start with on
Object.keys(window).filter(k => !k.indexOf('on'))
BUT that is not going to return just the built in ones. If someone set a custom event listener like
window.onfoobar = function () {}
than that will also show up in the result.

I wrote an npm package that does that for you.
Full usage and installation: global-event-handlers-map.
it extracts every global event handler under every object that exists under window (including window).
for example, by calling:
const getGlobalEventsHandlersMap = require('global-event-handlers-map');
const gehsMap = getGlobalEventsHandlersMap('WebSocket');
you will get the following result (gehsMap would be):
{
"WebSocket": [
"onopen",
"onerror",
"onclose",
"onmessage"
]
}
by calling getGlobalEventsHandlersMap() with no arguments, you will receive ALL global event handlers.
the README file should be very indicative and should help you understand how to get everything you need from that package.
you can either:
execute the code once in the browser, get the results, and use that map statically in your code.
integrate the library in your code and by that dynamically create the map every time your code runs in the browser.
the best way depends on your needs, and should be your call. i can help you understand which way is best for you depends on your needs.
hope that helps!

Using CRM WebAPI to execute GetAllTimeZonesWithDisplayName function

I'm trying to execute the GetAllTimeZonesWithDisplayName function to retrieve the current user's timezone; however I'm having some difficulties
I've been following this blog but something seems to have changed. According to the author I should be able to go:
/api/data/v8.2/GetAllTimeZonesWithDisplayName(LocaleId=1033)
but this results in an error like:
{
"error":
{
"code":"",
"message":"Resource not found for the segment 'GetAllTimeZonesWithDisplayName'.",
"innererror":{
"message":"Resource not found for the segment 'GetAllTimeZonesWithDisplayName'.",
"type":"Microsoft.OData.Core.UriParser.ODataUnrecognizedPathException"
,"stacktrace":...
}
}
}
So I had a look in the metadata (/api/data/v8.2/$metadata) and I can see that this method requires two parameters (I think)
<Function Name="GetAllTimeZonesWithDisplayName" IsBound="true">
<Parameter Name="entityset" Type="Collection(mscrm.timezonedefinition)" Nullable="false"/>
<Parameter Name="LocaleId" Type="Edm.Int32" Nullable="false"/>
<ReturnType Type="Collection(mscrm.crmbaseentity)" Nullable="false"/>
</Function>
But I don't know what is required for the entityset parameter and it doesn't seem to be listed in the MSDN documentation

The function, according to a metadata, is bound to an entityset Parameter Name="entityset" Type="Collection(mscrm.timezonedefinition)" Nullable="false"/> means you should start it from the set. And, I don't know why, usage of bound functions requires full function name so the result will be:
/api/data/v8.2/timezonedefinitions/Microsoft.Dynamics.CRM.GetAllTimeZonesWithDisplayName(LocaleId=1033)

Set default value of validation

I am using Joi to validate a payload of a service in my node.js server using hapijs framework. It used to look like this (in my typescript code as well as after compiling to javascript):
payload: {
para1: Joi.number().required(),
para2: Joi.string()
}
Now I want to set default value of the two parameters. If the code is written in javascript, I can do this:
payload: {
para1: Joi.number().required().default(1),
para2: Joi.string().default("defaultstring")
}
I tested it in swagger and the default values actually became the values I set.
However, my project is written in typescript. I did the same thing and compiled typescript code. The result javascript looks like this:
payload: {
para1: Joi.number().required()["default"](1),
para2: Joi.string()["default"]("defaultstring")
}
In swagger, the default values are not applied.
Here are my questions:
why the code becomes different after compiling?
what does ["default"]("defaultstring") mean and what does it do?
how can I write typescript code to make sure it can compiled as Joi.string().default("defaultstring")
Update
According to #rsp's post, the format in question 2 is just different way to access object's property. I also get reference from here. But it doesn't explain if they have any difference. Does anyone have any idea?
Update2
Here is the difference between the two ways accessing JS property. It seems there is no negative effect using brackets way. However, in my case, the default values are not reflected on swagger. Will be doing research on it.

In JavaScript this:
required().default(1)
is the same as this:
required()["default"](1)
because you can access object properties either as:
object["propertyName"]
or:
object.propertyName
(with certain restrictions in the second case).
So it's strange that TypeScript would output the longer style if it doesn't have to, but it's also strange that the longer style doesn't work exactly the same as the shorter one.
I would try to manually change the compiled JavaScript to the shorter version and see if that helps. If it doesn't then the problem is somewhere else. My suspicion is that it will not help.
The .default() should work in TypeScript because it is defined in #types/joi - see:
https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/joi/index.d.ts#L272-L273
But on the other hand there is this comment:
// TODO express type of Schema in a type-parameter (.default, .valid, .example etc)
Which may suggest that .default() implementation is not ready yet - see:
https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/joi/index.d.ts#L6
and also there's this issue: joi.d.ts out of date, missing types
https://github.com/DefinitelyTyped/DefinitelyTyped/issues/9332

Use should use default() like in below code:
validate: {
payload: {
para1: Joi.number().integer().min(1).max(100).default(10).required(),
para2: Joi.string().min(1).max(100).default("TEST").required(),
}
}

It still says key is required when we use Joi.boolean().required().default(true)
The below worked for me
JOI.boolean().default(false)

taxAmount: Joi.number().default(0),
totalAmount: Joi.number().default(0),
This works for me. Do not use .reqquired() keyword.
The result will be in the
const validationResult = schema.validate(data);
validationResult.value

Need help configuring JavaScript- and JSON-powered localization for a web app

I'm trying to configure a web application that can use client-side JavaScript for localization (as it has to be able to run offline). I've set up a function and a JSON array in my JavaScript like so:
var l10n = {
"getMessage": function(msg) {
return locales.en.msg;
}
}
and
var locales = {
"en": {
"applicationName": "This is the application name!",
"msg": "Looks like we've gotta problem."
}
}
But if, for example, I enter the command l10n.getMessage("applicationName") the script always returns the "msg" string ("Looks like we've gotta problem." which I've put there for debugging).
The problem is obviously with my l10n.getMessage() function. For all I know, it could be a really simple solution, but with my basic JavaScript knowledge, I can't work out how to fix it. How would I best go about fixing this so that it returns the message for the desired string?
Thanks in advance for your help!

Yeah, it's actually a simple syntax fix. Use bracket notation to retrieve a property off an object using a variable:
var l10n = {
"getMessage": function(msg) {
return locales.en[msg];
}
};
Demo: http://jsfiddle.net/wC4PN/