Html: About the term "top-level-browsing-context"

Created on 5 Feb 2017 · 3Comments · Source: whatwg/html

In the spec:

A browsing context that is not a nested browsing context has no parent browsing context, and is the top-level browsing context of all the browsing contexts for which it is an ancestor browsing context.

I think I can't understand what it means very well,could you give some little example?Thanks a lot.

clarification good first issue

Source

NE-SmallTown

Most helpful comment

Consider this document:

<!-- a.html -->
<!doctype html>
<title>A</title>
<p>A</p>
<iframe src="b.html"></iframe>
<button onclick="window.open('c.html')">open</button>

When clicking the button, there will be three browsing contexts:

| A                                   |
|  +-----------------------+          |
|  | B                     |          |
|  |                       |          |
|  +-----------------------+ ( open ) |
|                                     |
|         +-------------------------------------+
|         | C                                   |
|         |                                     |
+---------|                                     |
          |                                     |
          |                                     |
          +-------------------------------------+

A is a top-level browsing context. It is the parent and ancestor of B.
B is a child browsing context (and document-tree child browsing context) of A.
C is a top-level browsing context and an auxillary browsing context. Its opener browsing context is A.

Does that help? If so, we can maybe convert the diagram to SVG and put this into the standard.

zcorpan on 6 Feb 2017

👍6 ❤1 🎉1

All 3 comments

Consider this document:

<!-- a.html -->
<!doctype html>
<title>A</title>
<p>A</p>
<iframe src="b.html"></iframe>
<button onclick="window.open('c.html')">open</button>

When clicking the button, there will be three browsing contexts:

| A                                   |
|  +-----------------------+          |
|  | B                     |          |
|  |                       |          |
|  +-----------------------+ ( open ) |
|                                     |
|         +-------------------------------------+
|         | C                                   |
|         |                                     |
+---------|                                     |
          |                                     |
          |                                     |
          +-------------------------------------+

A is a top-level browsing context. It is the parent and ancestor of B.
B is a child browsing context (and document-tree child browsing context) of A.
C is a top-level browsing context and an auxillary browsing context. Its opener browsing context is A.

Does that help? If so, we can maybe convert the diagram to SVG and put this into the standard.

zcorpan on 6 Feb 2017

👍6 ❤1 🎉1

@zcorpan Thanks for your clarification!It does help for me.

Yes, I believe put this diagram into the standard will be helpful for others.In addition,I think you can simplify the words I mention above in this issue because it's a liitle huge and complex,or you can put this diagram into the standard and divide the sentence to many pieces and explain each the corresponding piece by using some words with the diagram.

For example:

In the spec: