Skip to content

Commit

Permalink
Document the turbo-frame[complete] attribute
Browse files Browse the repository at this point in the history
Explain the `[complete]` attribute's behavior introduced in
[hotwired/turbo#487][].

[hotwired/turbo#487]: hotwired/turbo#487
  • Loading branch information
seanpdoyle committed Jun 19, 2022
1 parent d429944 commit 7f901bb
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 0 deletions.
3 changes: 3 additions & 0 deletions _source/handbook/03_frames.md
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,9 @@ Note that the `<turbo-frame>` on `/emails/set_aside` does not contain a `src` at

During navigation, a Frame will set `[aria-busy="true"]` on the `<turbo-frame>` element when fetching the new contents. When the navigation completes, the Frame will remove the `[aria-busy]` attribute. When navigating the `<turbo-frame>` through a `<form>` submission, Turbo will toggle the `[aria-busy="true"]` attribute in tandem with the Frame's.

After navigation finishes, a Frame will set the `[complete]` attribute on the
`<turbo-frame>` element.

[aria-busy]: https://www.w3.org/TR/wai-aria/#aria-busy

## Lazy-Loading Frames
Expand Down
3 changes: 3 additions & 0 deletions _source/reference/frames.md
Original file line number Diff line number Diff line change
Expand Up @@ -114,6 +114,9 @@ attributes and JavaScript properties.
* `target` refers to another `<turbo-frame>` element by ID to be navigated when
a descendant `<a>` is clicked. When `target="_top"`, navigate the window.

* `complete` is a boolean attribute whose presence or absence indicates whether
or not the `<turbo-frame>` element has finished navigating.

* `autoscroll` is a [boolean attribute][] that controls whether or not to scroll
a `<turbo-frame>` element (and its descendant `<turbo-frame>` elements) into
view when after loading. Control the scroll's vertical alignment by setting the
Expand Down

0 comments on commit 7f901bb

Please sign in to comment.