I need some help with a quick bookmarklet

JavaScript
21

I’m not sure what you mean. That looks like it would work, but I assume you have to replace “hasURLParam” with something else?

22

When I put most of the code into a function, I want to know when it’s working as expected, and what needs to be fixed.

function getHref(search, href) {
  const params = new URLSearchParams(search)
  const step1 = params.get('url') || href
  var step2 = step1.replace('http://','');
  var step3 = step2.replace('https://','');
  url = "http://" + step3;
  return url;
}

var url = getHref(window.location.search, window.location.href);
window.location.href = 'http://summitnet.pw/pages/frame?url=' + btoa(url);

We can now simplify things down to what occurs based on just the search and href parameters.

The following test shows what happens when things are working right:

describe("getHref tests", function () {
  it("gives the http search value", function () {
    var url = "http://www.google.com";
    var search = "url=" + url;
    var href = "http://example.com";
    expect(getHref(search, href)).toBe(url);
  });
});

And when there’s no protocol on there, one gets added:

  it("adds http:// when protocol is missing", function () {
    var url = "www.google.com";
    var search = "url=" + url;
    var href = "http://example.com";
    expect(getHref(search, href)).toBe("http://" + url);
  });

And when there’s no url, it gives the href instead.

  it("gives the href when search is empty", function () {
    var search = "";
    var href = "http://example.com";
    expect(getHref(search, href)).toBe(href);
  });

Those all work as expected. The situation that you want to be dealt with though is when https is in the protocol. You want it to remain as https, which is shown by this test code:

  it("gives the https search value", function () {
    var url = "https://www.google.com";
    var search = "url=" + url;
    var href = "http://example.com";
    expect(getHref(search, href)).toBe(url);
  });

The failing test is shown at https://jsfiddle.net/pmw57/5qksj8La/

Are those tests an accurate representation of how the code is supposed to work?

23

Yes.

24

In that case, we can get rid of most of steps and return the url if it starts with http (which also works for https)

If that didn’t happen, then we return the url with http added to the start.

function getHref(search, href) {
  const params = new URLSearchParams(search)
  const url = params.get('url') || href
  if (url.indexOf("http") === 0) {
    return url;
  }
  return "http://" + url;
}

All of the tests now pass. https://jsfiddle.net/pmw57/5qksj8La/2/

Are there any other situations that the code is supposed to deal with?

25

Yeah that looks great

26

I am trying to use this as a bookmarklet, so I will be setting the result as a param in the url, before redirecting. In this case, I won’t need to make it a function, so how could I just set it as a param?

27

The return keyword stops execution of the function at that point, and gives the returned value back to whatever called the function.

28

I am trying to use this as a bookmarklet, so I will be setting the result as a param in the url, before redirecting. In this case, I won’t need to make it a function, so how could I just set it as a param?

29

Now that the tests show that the code in the function works as desired, you can extract the contents of the function and use that instead.

30

Okay, how do I instead of returning the string, make it a variable?

31

It’s fully allowed to have the function in a bookmarklet too, which also helps to make it easier to use the code.

32

Yeah, but I don’t know how I would add a param to the url with that function

33

There is example code at https://jsfiddle.net/pmw57/5qksj8La/2/ showing exactly how to do that.

34

Okay, to clarify, this code should work?

function getHref(search, href) {
  const params = new URLSearchParams(search)
  const url = params.get('url') || href
  if (url.indexOf("http") === 0) {
    return url;
  }
  return "http://" + url;
}

var url = getHref(window.location.search, window.location.href);
window.location.href = 'http://summitnet.pw/pages/frame?url=' + btoa(url);
35

Yes indeed.

36

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.