Custom Google AMP tag and attributes in PhpStorm?

Question

Is there any support of custom tags and attributes for AMP project (by Google) in PhpStorm ?

For example <amp-sidebar>, <style amp-custom>...

Answer 1

Using the terminal and jq with the json validator, I made an extractor of valid amp tags to add to PhpStorm custom tags.

Generator

curl -s https://cdn.ampproject.org/v0/validator.json | jq --compact-output --raw-output '[.tags[].tagName] | unique | map(select(startswith("AMP-"))) | join(",") | ascii_downcase'

Current output

amp-3d-gltf,amp-3q-player,amp-accordion,amp-action-macro,amp-ad,amp-ad-custom,amp-ad-exit,amp-addthis,amp-analytics,amp-anim,amp-animation,amp-apester-media,amp-app-banner,amp-audio,amp-auto-ads,amp-autocomplete,amp-base-carousel,amp-beopinion,amp-bind-macro,amp-bodymovin-animation,amp-brid-player,amp-brightcove,amp-byside-content,amp-call-tracking,amp-carousel,amp-connatix-player,amp-consent,amp-dailymotion,amp-date-countdown,amp-date-display,amp-date-picker,amp-delight-player,amp-embed,amp-embedly-card,amp-embedly-key,amp-experiment,amp-facebook,amp-facebook-comments,amp-facebook-like,amp-facebook-page,amp-fit-text,amp-font,amp-fx-flying-carpet,amp-geo,amp-gfycat,amp-gist,amp-google-assistant-assistjs-config,amp-google-assistant-inline-suggestion-bar,amp-google-assistant-voice-bar,amp-google-assistant-voice-button,amp-google-document-embed,amp-gwd-animation,amp-hulu,amp-iframe,amp-iframely,amp-ima-video,amp-image-lightbox,amp-image-slider,amp-img,amp-imgur,amp-inline-gallery,amp-inline-gallery-pagination,amp-inline-gallery-thumbnails,amp-instagram,amp-install-serviceworker,amp-izlesene,amp-jwplayer,amp-kaltura-player,amp-layout,amp-lightbox,amp-link-rewriter,amp-list,amp-list-load-more,amp-live-list,amp-mathml,amp-mega-menu,amp-megaphone,amp-minute-media-player,amp-mowplayer,amp-nested-menu,amp-next-page,amp-nexxtv-player,amp-o2-player,amp-onetap-google,amp-ooyala-player,amp-orientation-observer,amp-pan-zoom,amp-pinterest,amp-pixel,amp-playbuzz,amp-position-observer,amp-powr-player,amp-reach-player,amp-recaptcha-input,amp-redbull-player,amp-reddit,amp-render,amp-riddle-quiz,amp-script,amp-selector,amp-sidebar,amp-skimlinks,amp-smartlinks,amp-social-share,amp-soundcloud,amp-springboard-player,amp-state,amp-sticky-ad,amp-story,amp-story-360,amp-story-animation,amp-story-auto-ads,amp-story-auto-analytics,amp-story-bookend,amp-story-consent,amp-story-cta-layer,amp-story-grid-layer,amp-story-interactive-binary-poll,amp-story-interactive-poll,amp-story-interactive-quiz,amp-story-interactive-results,amp-story-page,amp-story-page-attachment,amp-story-page-outlink,amp-story-panning-media,amp-story-player,amp-story-social-share,amp-stream-gallery,amp-timeago,amp-truncate-text,amp-twitter,amp-user-notification,amp-video,amp-video-iframe,amp-vimeo,amp-vine,amp-viqeo-player,amp-vk,amp-web-push,amp-web-push-widget,amp-wistia-player,amp-yotpo,amp-youtube

Setting in PhpStorm

Open inspections (File | Settings | Editor | Inspections > HTML > Invalid HTML tag) then add the output above.