Category: JavaScript Answers

To fix hostname/IP does not match certificate’s altnames with Node.js and JavaScript, we create a proxy.

For instance, we write

const httpProxy = require("http-proxy");
const proxy = httpProxy.createProxyServer();

proxy.web(req, res, {
  changeOrigin: true,
  target: "https://example.com:3000",
});

to create a proxy with the http-proxy package.

We call createProxyServer to create the proxy.

And we set the target to the destination URL to proxy to.

If we’re using HTTPS, we write

const httpProxy = require("http-proxy");

httpProxy
  .createServer({
    ssl: {
      key: fs.readFileSync("valid-ssl-key.pem", "utf8"),
      cert: fs.readFileSync("valid-ssl-cert.pem", "utf8"),
    },
    target: "https://example.com:3000",
    secure: true,
  })
  .listen(443);

to call createServer to create the proxy server.

We set the SSL key and certificate files.

And we set the target to the destination URL to proxy to.

We set secure to true to let us proxy HTTPS traffic.

To check if function was called with Jest and JavaScript, we create a spy and use the toHaveBeenCalled method.

For instance, we write

const child = require("./child");
const main = require("./add").main;

const spy = jest.spyOn(child, "child");

describe("main", () => {
  it("should call child fn", () => {
    expect(main(1)).toBe(2);
    expect(spy).toHaveBeenCalled();
  });
});

to create a test with it.

We call jest.spyOn in the it test callback to create a spy on the child module’s child function.

Then we call main which calls child.

And then we call expect with spy and toHaveBeenCalled to check if the child function is called.

To copy a URL to the clipboard with JavaScript, we can call navigator.clipboard.writeText with the URL string.

For instance, we write:

<button>
  copy
</button>

to add a button.

Then we write:

const button = document.querySelector('button')
button.onclick = () => {
  navigator.clipboard.writeText('http://example.com');
}

We get the button with document.querySelector.

Then we set the button.onclick property to a function that calls navigator.clipboard.writeText with 'http://example.com' to copy 'http://example.com' to the clipboard.

To format current time into yyyy-mm-dd format with JavaScript, we call toLocaleString, toLocaleDateString or toLocaleTimeString.

For instance, we write

const d = new Date();
console.log(d.toLocaleString('en-SE'));
console.log(d.toLocaleDateString('en-SE'));

to create date d with the current datetime.

And then we call toLocaleString to return a string with the human readable locale datetime string with date and time being the values in d.

We call toLocaleDateString to return a string with the human readable locale date string with date and time being the values in d.

We call them all with a locale that has dates in yyyy-mm-dd format to return a date string in this format.

Conclusion

To format current time with JavaScript, we call toLocaleString, toLocaleDateString or toLocaleTimeString.

Sometimes, we want to set custom validation message for HTML5 form required attribute with JavaScript.

In this article, we’ll look at how to set custom validation message for HTML5 form required attribute with JavaScript.

How to set custom validation message for HTML5 form required attribute with JavaScript?

To set custom validation message for HTML5 form required attribute with JavaScript, we call the setCustomValidity method.

For instance, we write

<input
  type="text"
  id="username"
  required
  placeholder="Enter Name"
  oninvalid="this.setCustomValidity('Enter User Name Here')"
  oninput="this.setCustomValidity('')"
/>

to call setCustomValidity with the validation message we want to show.

oninput is run as we type and oninvalid is run when the input is invalid.

Conclusion

To set custom validation message for HTML5 form required attribute with JavaScript, we call the setCustomValidity method.