Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Recursively collect delegate headers to include in fetch request #110

Closed

Conversation

tleish
Copy link
Contributor

@tleish tleish commented Jan 15, 2021

Closes #86

When turbo sends a fetch, it uses the following method in FetchRequest to get additional headers:

  // FetchRequest
  get additionalHeaders() {
    if (typeof this.delegate.additionalHeadersForRequest == "function") {
      return this.delegate.additionalHeadersForRequest(this)
    } else {
      return {}
    }
  }

When the this.delegate=FrameController, the FrameController adds the Turbo-Frame header to the request.

  // FrameController
  additionalHeadersForRequest(request: FetchRequest) {
    return { "Turbo-Frame": this.id }
  }

TURBO-FRAME GET

For a GET form inside. a turbo-frame, this.delegate=FrameController. So, form#GET requests include the Turbo-Frame header.

TURBO-FRAME NON-GET (e.g. POST/PUT/DELETE)

For a NON-GET form inside. a turbo-frame, this.delegate=FrameController. Which means, no Turbo-Frame header.

The system does detect the turbo-frame, it just wraps it in FormSubmission and assigns FrameController as the delegate.
FormSubmission = { delegate: FrameController }

Perhaps there are other nested delegate scenarios (e.g. ViewController). This update traverses delegates to collect all additionalHeadersForRequest. It also ensures that headers from the closest delegate relatives override headers from the most distance delegate relatives.

@tleish tleish force-pushed the add-all-headers-to-fetch-request branch from f3d413a to 9c8f35c Compare January 31, 2021 14:05
@tleish
Copy link
Contributor Author

tleish commented Jan 31, 2021

Updated code to support addition of prepareHeadersForRequest

seanpdoyle added a commit to seanpdoyle/turbo that referenced this pull request Feb 7, 2021
Closes hotwired#86
Closes hotwired#110

Recursively walk the tree of dependent FetchRequestDelegates so that
they all have an opportunity to modify the fetch request headers.

Testing adds listeners for `turbo:before-fetch-request` and
`turbo:before-fetch-response` so that the event logs can drain.

Co-authored-by: tleish <tleish@users.noreply.github.com>
@seanpdoyle
Copy link
Contributor

I've opened #166 to extend this work and account for test coverage. @tleish I've added you as co-author. Do you mind if I close this PR in favor of #166?

seanpdoyle added a commit to seanpdoyle/turbo that referenced this pull request Feb 7, 2021
Closes hotwired#86
Closes hotwired#110

Recursively walk the tree of dependent FetchRequestDelegates so that
they all have an opportunity to modify the fetch request headers.

Testing adds listeners for `turbo:before-fetch-request` and
`turbo:before-fetch-response` so that the event logs can drain.

Co-authored-by: tleish <tleish@users.noreply.github.com>
seanpdoyle added a commit to seanpdoyle/turbo that referenced this pull request Feb 7, 2021
Closes hotwired#86
Closes hotwired#110

When submitting a Form that is within a `<turbo-frame>` or targets a
`<turbo-frame>`, ensure that the `Turbo-Frame` header is present.

Testing adds listeners for `turbo:before-fetch-request` and
`turbo:before-fetch-response` so that the event logs can drain.

Co-authored-by: tleish <tleish@users.noreply.github.com>
seanpdoyle added a commit to seanpdoyle/turbo that referenced this pull request Feb 7, 2021
Closes hotwired#86
Closes hotwired#110

When submitting a Form that is within a `<turbo-frame>` or targets a
`<turbo-frame>`, ensure that the `Turbo-Frame` header is present.

Since the constructive-style
`FetchRequestDelegate.additionalHeadersForRequest()` was replaced by the
mutative style `FetchRequestDelegate.prepareHeadersForRequest()`, this
commit changes the `FetchRequest.headers` property to be `readonly` and
created at constructor-time so that its values can be mutated prior to
the request's submission.

Testing adds listeners for `turbo:before-fetch-request` and
`turbo:before-fetch-response` so that the event logs can drain.

Co-authored-by: tleish <tleish@users.noreply.github.com>
@tleish tleish closed this Feb 7, 2021
seanpdoyle added a commit that referenced this pull request Feb 12, 2021
Closes #86
Closes #110

When submitting a Form that is within a `<turbo-frame>` or targets a
`<turbo-frame>`, ensure that the `Turbo-Frame` header is present.

Since the constructive-style
`FetchRequestDelegate.additionalHeadersForRequest()` was replaced by the
mutative style `FetchRequestDelegate.prepareHeadersForRequest()`, this
commit changes the `FetchRequest.headers` property to be `readonly` and
created at constructor-time so that its values can be mutated prior to
the request's submission.

Testing adds listeners for `turbo:before-fetch-request` and
`turbo:before-fetch-response` so that the event logs can drain.

Co-authored-by: tleish <tleish@users.noreply.github.com>
seanpdoyle added a commit that referenced this pull request Apr 9, 2021
Closes #86
Closes #110

When submitting a Form that is within a `<turbo-frame>` or targets a
`<turbo-frame>`, ensure that the `Turbo-Frame` header is present.

Since the constructive-style
`FetchRequestDelegate.additionalHeadersForRequest()` was replaced by the
mutative style `FetchRequestDelegate.prepareHeadersForRequest()`, this
commit introduces a readonly `FetchRequestHeaders` property created at
constructor-time so that its values can be mutated prior to the
request's submission.

Co-authored-by: tleish <tleish@users.noreply.github.com>
seanpdoyle added a commit to seanpdoyle/turbo that referenced this pull request Apr 9, 2021
Closes hotwired#86
Closes hotwired#110

When submitting a Form that is within a `<turbo-frame>` or targets a
`<turbo-frame>`, ensure that the `Turbo-Frame` header is present.

Since the constructive-style
`FetchRequestDelegate.additionalHeadersForRequest()` was replaced by the
mutative style `FetchRequestDelegate.prepareHeadersForRequest()`, this
commit introduces a readonly `FetchRequestHeaders` property created at
constructor-time so that its values can be mutated prior to the
request's submission.

Co-authored-by: tleish <tleish@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

Missing Turbo-Frame header when submitting a form
2 participants