[SOLVED] Frameset and javascript variables interaction

Frameset and javascript variables interaction

I know that framesets are not exactly cutting-edge technology, but I had to debug an old application and I came across an unexpected behaviour.

Here is some simple HTML pages to show this behaviour.

index.html :

<html>
  <frameset rows="22,*" border="0">
    <frame name="menu" src="menu.html" marginheight=0 marginwidth=0>
    <frame name="submenu" src="content1.html">
  </frameset>
</html>

menu.html :

<html>
  <body>
    <table width=100% border=0 spacing=1>
      <tr>
        <td><a href="content1.html" target="submenu">Content 1</a></td>
        <td><a href="content2.html" target="submenu">Content 2</a></td>
      </tr>
    </table>
  </body>
</html>

content1.html :

<html>
  <body>
    <p>Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy foster collaborative thinking to further the overall value proposition. Organically grow the holistic world view of disruptive innovation via workplace diversity and empowerment.</p>
  </body>
</html>

content2.html :

<html>
  <body>
    <p>Seasonal, whipped java aftertaste lungo ristretto, a turkish chicory affogato saucer. Medium, spoon et skinny americano cappuccino lungo dripper.</p>
  </body>
</html>

The behaviour is what is expected : when we click on a menu link, the content of the submenu is updated.

Now, I add a line in the body of content2.html : <script>var name = "why" ;</script>

If I click on "content 2" link, the content is refreshed, but from now, when I click an any link, the content of the frame is opened in a new tab. I can reproduce this behaviour with any modern browser (Chrome, Firefox, Edge, ...) : a name javascript variable in a "main" script change the behaviour of the frameset.

Do anyone have an explanation for that ? I don't think that name is a reserved keyword ? And why this new tab opening and not a broken script ?

Solution

var name, if used as a global, is the same as window.name.

window.name is the property which holds the name of the frame.

If you change the name to one which doesn't match the target (e.g. from submenu to why), then there is no matching target so a new one has to be created.