Skip to content

Conversation

@westonruter
Copy link
Member

Summary

As of ampproject/amphtml#35027, Bento versions of amp-twitter, amp-facebook-*, and amp-instagram will require an overflow button to resize if they are in the initial viewport. This is to prevent these components from negatively impacting CLS, as they do currently. To prevent the need for users to click the overflow button, we'll eventually need to provide the components the required dimensions up-front as much as possible. See #4729.

Checklist

  • My code is tested and passes existing tests.
  • My code follows the Engineering Guidelines (updates are often made to the guidelines, check it out periodically).

@westonruter westonruter added this to the v2.2 milestone Jul 30, 2021
@westonruter westonruter requested a review from pierlon July 30, 2021 22:36
@github-actions
Copy link
Contributor

github-actions bot commented Jul 30, 2021

Plugin builds for 294628a are ready 🛎️!

@westonruter westonruter enabled auto-merge July 30, 2021 23:21
@westonruter westonruter merged commit 44c641e into develop Jul 30, 2021
@westonruter westonruter deleted the add/social-embed-overflow-buttons branch July 30, 2021 23:52
@delawski
Copy link
Collaborator

QA Passed

When embedding a Facebook post, an overflow button is added to the markup (it's not visible on the page itself):

Screenshot 2021-11-30 at 19 36 14

Tested on AMP Version 2.2.0-alpha-20211123T020732Z-5405daa

@delawski delawski self-assigned this Nov 30, 2021
@delawski
Copy link
Collaborator

delawski commented Dec 6, 2021

I did another round of QA using the instructions shared by @westonruter on #6504 (comment).

Bento versions of amp-facebook, amp-instagram, and amp-twitter (as per #6504) display the "See more" button if placed "above the fold":

Initial embed Expanded embed
Screenshot 2021-12-06 at 13 53 12 Screenshot 2021-12-06 at 13 53 18
Screenshot 2021-12-06 at 13 45 47 Screenshot 2021-12-06 at 13 45 59

@westonruter westonruter added the Changelogged Whether the issue/PR has been added to release notes. label Dec 15, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Bento Changelogged Whether the issue/PR has been added to release notes. Embeds

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants