1

I'm trying to create a chrome extension that will allow me to display the current URL in a modal or popup window. The URL will be enlarged so that it is easier for students to see in the classroom. My goal is to get away from my current method, which is to copy/paste the URL into notepad and enlarge the font so that students in the back of the room can see it. It would be great if I could simply click on an extension and have the URL displayed in a nice large font. Unfortunately, this is the first chrome extension I've ever written, so I'm running into all sorts of n00b issues.

Anyway, I've gotten close by following this post: How can I get the URL of the current tab from a Google Chrome extension?

Here's my code:

chrome.tabs.getSelected(null,function(tab) {
    var tablink = tab.url;
    document.write("<h1 style='font-size: 100px;'>" + tablink + "</h1>");
});

The problem is this code opens the URL in a popup with a horizontal scroll bar. I either need to:

  • figure out a way to turn on word-wrap (to eliminate the scroll bar) ... or
  • adjust the width of the popup window so that it takes up the entire width of the screen ... or
  • find a different window solution (modal, new window that's alwaysOnTop, etc)

I tried chrome.windows.create but I couldn't figure out how to adapt the code above to use chrome.windows.create, and I also couldn't figure out how to make the resulting new window have active focus (focused: true didn't seem to work for me).

I also read that chrome.tabs.getSelected has been deprecated and I should be using chrome.tabs.query. However, I've had trouble getting the query method to work.

Again, this is my first chrome extension, so your patience, understanding, and help is greatly appreciated. Thanks!

Community
  • 1
  • 1
Tyler Youngblood
  • 2,710
  • 3
  • 18
  • 24
  • A side note: `chrome.tabs.getSelected` is deprecated; you need to use `chrome.tabs.query({active:true}, function (tab)...)`. As to your question: I assume your code is triggered on "browser action"? If so -- is that the way you'd like it? And if so -- why not just add a little CSS to "turn on word wrap? – Nitzan Shaked Aug 02 '14 at 20:17
  • Hi Nitzan, thank you for your response. Admittedly, I hadn't thought of using CSS for word wrap, that's a great idea. And I did read after posting this that chrome.tabs.getSelected has been deprecated. But thanks for including that in your response for other's benefit. My code will be triggered when a user (an instructor) presses the extension button. That way the instructor can toggle the URL on/off as needed for those sitting in the back of the class. A colleague of mine suggested using javascript to inject the HTML containing the URL directly into the body of the page. So I might try that. – Tyler Youngblood Aug 04 '14 at 13:11

0 Answers0