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

✨ amp-autocomplete: Support SSR templating #25260

Merged
merged 37 commits into from Dec 2, 2019

Conversation

caroqliu
Copy link
Contributor

@caroqliu caroqliu commented Oct 25, 2019

If server-side rendering is supported when there is a template provided, amp-autocomplete will proxy the XHR for remote data and render the response. This change is one in a series to make it possible to support amp-autocomplete in AMP for Email #24881 cc/ @ampproject/wg-amp4email

Note: When SSR is supported, client-side filtering is disabled.

TODO

  • Manual test in viewer and non-viewer contexts
  • Unit test for SSR branches

examples/viewer.html Outdated Show resolved Hide resolved
extensions/amp-autocomplete/0.1/amp-autocomplete.js Outdated Show resolved Hide resolved
extensions/amp-autocomplete/0.1/amp-autocomplete.js Outdated Show resolved Hide resolved
extensions/amp-autocomplete/0.1/amp-autocomplete.js Outdated Show resolved Hide resolved
examples/amp-autocomplete.ssr.html Outdated Show resolved Hide resolved
examples/amp-autocomplete.ssr.html Outdated Show resolved Hide resolved
extensions/amp-autocomplete/0.1/amp-autocomplete.js Outdated Show resolved Hide resolved
extensions/amp-autocomplete/0.1/amp-autocomplete.js Outdated Show resolved Hide resolved

this.filter_ = userAssert(
this.element.getAttribute('filter'),
`${TAG} requires "filter" attribute.`

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

filter doesn't default to "NONE" if the attribute is not present?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No. The filter attribute specifies a type of client-side filtering, so it is better if the publisher explicitly identifies when they don't want that. If we default to some value silently, it could be hard to debug an undesirable behavior here.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should the attribute be mandatory: true in validation then?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, that sounds like a reasonable change to me. Would you prefer that in this PR or in a follow up?

The reason that it wasn't originally marked as mandatory in the validations was because it was assumed it could be enforced here for both valid and invalid AMP pages at runtime.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Follow-up is fine.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

extensions/amp-autocomplete/0.1/amp-autocomplete.js Outdated Show resolved Hide resolved
extensions/amp-autocomplete/0.1/amp-autocomplete.js Outdated Show resolved Hide resolved
src/service/template-impl.js Show resolved Hide resolved
* @return {!Promise}
* @private
*/
autocomplete_(data, opt_input = '') {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks better, thanks. For future work: should we add user messaging for the failure cases below?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good idea, that is more in line with how other components behave, esp regarding data['html']

}

const ampAutocomplete = new AmpAutocomplete(element);
const ssrTemplateHelper = ampAutocomplete.getSsrTemplateHelper();

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Heh, now that we fixed ssrTemplateHelper_ I noticed a lot of usage of other private vars in this test file.

No action needed but note for the future.

@caroqliu caroqliu merged commit ed9d144 into ampproject:master Dec 2, 2019
@caroqliu caroqliu deleted the autocomplete-ssr branch December 2, 2019 17:39
caroqliu added a commit to caroqliu/amphtml that referenced this pull request Dec 5, 2019
* First pass

* Will comments

Test

* Replace template userAssert() with user().warn()

* Add specificity to maybeFindTemplate querySelector

* Remove template check in buildCallback

* Support autocomplete in examples/viewer.html

* Fix check-types issues

* Add unit tests

* Fix visual test

* Will comments

* Treat ssr isSupported() like a Promise

* Don't treat SSR like a promise

* .

* Fix indentation

* Refactor assertions

* s/r/request

* Refactor tests

* SSR note

* Type check

* Oops more type check

* Fix indentations

* Tests with length

* Sepand remaining comments

* Restructure SSR-related assertions in build

* Change data-value assertion to warning

* .

* Disallow filter attribute for ssr

* Intermediary `autocomplete_` function

* Update comment

* Modify unit tests

* Fix test after merge

* Alphabetize imports

* Stub ssrTemplateHelper
micajuine-ho pushed a commit to micajuine-ho/amphtml that referenced this pull request Dec 27, 2019
* First pass

* Will comments

Test

* Replace template userAssert() with user().warn()

* Add specificity to maybeFindTemplate querySelector

* Remove template check in buildCallback

* Support autocomplete in examples/viewer.html

* Fix check-types issues

* Add unit tests

* Fix visual test

* Will comments

* Treat ssr isSupported() like a Promise

* Don't treat SSR like a promise

* .

* Fix indentation

* Refactor assertions

* s/r/request

* Refactor tests

* SSR note

* Type check

* Oops more type check

* Fix indentations

* Tests with length

* Sepand remaining comments

* Restructure SSR-related assertions in build

* Change data-value assertion to warning

* .

* Disallow filter attribute for ssr

* Intermediary `autocomplete_` function

* Update comment

* Modify unit tests

* Fix test after merge

* Alphabetize imports

* Stub ssrTemplateHelper
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

6 participants