This is acceptable because `gtag.js` is also only loaded as part of the
service, similary `ga` is only registered in the service (so the
reporting was a noop if errors are thrown before -- no change here)
We can benefit from downleveling etc. and do not need to be careful
with the inline script in the `index.html`
PR Close#46801
We currently use Universal Analytics. This is deprecated in favor of
Google Analytics 4 and UA will stop processing hits in October 2023.
This change intends to prepare us for this migration, and to already
pre-populate our GA4 property (there is no way to migrate existing data
/properties into a GA4 property -- a new one needs to be created).
This will help us minimize the data gap so that we can:
* Continue to look at the UA property with the full time span until
October 2023
* Can start using the GA4 property long-term in the future, starting
with data even before Universal Analytics stops processing new data.
We need to keep the existing `analytics.js` setup. Initially we have
considered using `gtag.js` for both the UA and GA4 properties, as it
supports that, but that doesn't work with our strict trusted types
enforcement because it results in multiple `gtag.js` scripts (specific
versions for UA or GA4) that recreate the same trusted type policies.
This causes runtime errors and breaks the setup.
Instead, with continued use of `analytics.js` we have the benefit of
a good separation of trusted types + events and configuration. There is
some problematic with translation of Universal Analytics Events to GA4,
or the other way around (even though we don't use custom events
currenlty)
We also do not need to send page views for our GA4 property because GA4
with gtag supports this automatically (respecting the history state --
using the `Enhanced measurement events` setting in the UI).
For our UA legacy instance we continue to dispatch events manually. This
logic can be removed in the future.
More details can be found here:
https://docs.google.com/document/d/1aK8u4ZlXbqQ2wMqmgSX7Ces8iLgamC13oCoG6VeBruA/edit?usp=sharing&resourcekey=0-EVe-Rhnme3bj_pkz2RcOmw.
PR Close#46801
redesign the aio contributors page so that it displays the contributors
details as a list instead of using flipping cards, this should improve
the usability of the page and especially its accessibility
resolves#44346
PR Close#46347
add a mat open_in_new icon to the blog external link present in the
left sidenav on smaller screens so that it can be distinguished from
the other (/internal) links
this is a continuation of #45876
PR Close#46384
add an open_in_new icon to the blog external link present in the
aio-top-menu so that it can be distinguished from the other (/internal)
links
resolves#38412
PR Close#45876
improve the accessibility of the aio-select component so that it is
clear for screen reader users its functionality (currently it is
presented as a simple button), following the WAI-ARIA authoring
practices (see: https://www.w3.org/TR/wai-aria-practices/#combobox)
A first attempt in improving the accessibility of the component has been
tried in PR #45937 by replacing it with the material select component,
such implementation has however been scrapped since the increase of
payload sizes has proven prohibitively large
(also note that given native select elements haven't been used given the lack
of syling options for such elements)
PR Close#46013
add proper aria-labels for the twitter and website link of contributors
(which being icons they have no text) so that they can be correctly read
by screenreaders
also add aria-labels to the view-bio buttons for a better user
experience
PR Close#46324
This commit adds a tag processor for `@developerPreview`. Adding this tag to
an exported symbol or to a decorator parameter causes an API status tag to
be shown for the API which links to the Developer Preview documentation.
PR Close#46050
add a role and an aria-label to the aio-notification component so that
it can be handled better by assistive technologies
resolves#44345
PR Close#45770
Update angular.io to the latest prerelease versions of Angular CLI and
framework (v14.0.0-rc.0).
Also update angular.io to more closely align with new CLI apps. See also
the [diff][1] between a basic v13.0.0-next.9 CLI app and a v14.0.0-rc.0
one.
[1]: https://github.com/cexbrayat/angular-cli-diff/compare/13.0.0-next.9...14.0.0-rc.0
PR Close#45997
in the aio resources page there is a main h1 heading and then the next
headings used are h3 and h4, thus h2 is being skipped, change such
headings so that there is no heading skipping (which is a bad practice
and can result to confusing experiences from screen reader users)
PR Close#45822
currently the aio home page presents a single h1 which is ignored by
assistive technologies since it has its display set none, so replace it
with a new h1 containing the main text of the page instead
PR Close#45740
replace the generic `*` selector used in the alert styling with
`p` (which is what gets generated from the markdown) as the styling adds
margins which are not always wanted
PR Close#45761
use border-top-width instead of padding-top as the strategy for moving
the search-results panel down, this fixes the issue of the panel going
behind the toolbar (which causes either overlapping text in the home
page or the results scrollbar to be hidden behind the toolbar in other
pages)
PR Close#45579
The footer uses `h3` elements out of order, which causes a "Heading
elements are not in a sequentially-descending order" a11y error.
Replace the `h3` elements with `div` to improve a11y.
Fixes#44338
PR Close#45510
Previously, only `language="sh"` and `language="bash"` would be
recognized (and formatted) as cli commands in `<code-example>`.
This commit adds `shell` to the list of languages recognized as cli
commands.
(NOTE: This will fix the [CI failures][1] in #45325.)
[1]: https://circleci.com/gh/angular/angular/1145559
PR Close#45551
currently if a user tries to navigate via keyboard, once the are
presented with search results, the search results panel remains
present and can potentially hide most of the content on the page,
in such case keyboard navigation will be severly hindered and
the only option for the user would be to go back to the seach input
text and clear its value, fix such inconvenience by looping the
focus in the header area close to the search results and the
results panel itself
note: an alternative implementation using the cdkTrapFocus has been
attempted in PR #45194, such alternative implementation presented a
number of (minor) drawbacks (including the increase main bundle size
due to the inclusion of the A11yModule), so it was agreed to proceed
with the manual implementation present in these changes instead.
PR Close#44989
assign different aria labels to the primary nav and the one used for
guides and docs, so that impaired users can more easily distinguish the
two
PR Close#45209
remove redundant main role as pages should always have a
single element with a main role (also remove the role assigne
to the main tag as that is implied)
PR Close#45209
currently the navigation ul used in aio-top-menu has a role of
navigation, but listitems should be owned by list parents
(see more: https://www.w3.org/TR/wai-aria-1.1/#listitem)
so wrap the ul in a nav and remove the role="navigation" from the
ul element to fix such issue
resolves#44562resolves#16938 (the second point)
PR Close#45209
.substr() is deprecated so we replace it with functions which work similarily but aren't deprecated
Signed-off-by: Tobias Speicher <rootcommander@gmail.com>
PR Close#45397
the header hamburger menu gets removed from the page by moving it
outside the screen, it can however still be accessed via keyboard
navigation, add a visibility hidden to the element to prevent such
behavior
PR Close#45067
Previously, when the notification text did not fit on the viewport
width, it got truncated and it was not possible to see the whole text.
This commit fixes this by making the notification scrollable when the
text overflows.
PR Close#44900
On smaller screens, the action button in `NotificationComponent` is
hidden (due to limited horizontal screen "real estate"). Thus, the only
way to perform the action is to click on the notification message, which
is typically a link.
Previously, the link inside the notification did not take up the whole
height of the notification bar. As a result, clicking outside the link
would dismiss the notification without following the link.
This commit makes it easier to interact with the notification (esp. on
smaller screens) by ensuring the link covers the whole notification bar
(width and height).
PR Close#44900
The survey id is used as a key in the local storage to keep the state (don't show the message again). Reusing this survey id will make the message invisible to some users who already have that key in local storage.
PR Close#44865
The jasmine types for `spyObj.calls().all()` seem to be more specific,
relying on `ThisType<Fn>` to determine the context/receiver for an invoked
spy. This type does not work as expected with class members as it seems.
This commit fixes three of these type checking failures by explicitly casting
the spy context to the actual class owning the method member.
PR Close#44735
Refs #42966.
Look for changes in error docs (i.e. docs under `aio/content/error/`) in
`authors-package`, so that such docs are tracked when running the
`serve-and-sync` script.
PR Close#44704
Mock dates in EventsComponent tests are parsed in inconsistent ways
across platforms/browsers, which makes the comparison to the mocked
UTC "now" date behave differently causing the test to fail. This fix
ensures that the mocked "now" date is parsed in the same way as the
test dates to avoid inconsistencies.
PR Close#44763
since IE11 is no longer a supported browser, remove angular.io code
implemented specifically for IE11 support
this change reverts the following PRs:
- #26059 (slightly)
- #28188 (fully)
- #32871 (fully)
- #41183 (partially)
PR Close#44570
the height of code links (anchors inside code tags or
code tags inside anchors) is inconsistent, fix such
issue by also making sure that code links to external
resources do not get wrongly styled
PR Close#44376
improve aio-footer's layout by using grid instead of flexbox,
such change makes it so that we have four columns on wide window
sizes (desktop), two columns on medium window sizes (desktop/tablet)
and a single column on small window sizes (mobile), compared to the
flex implementation which could only have either 4 columns or 1
this makes the footer look generally nicer for various window sizes
(especially in the middle range in which one column was too little
and four were too much)
note: also a scroll of auto has been added so we that we can be sure
that overflowing footer content never creates a global layout issue
PR Close#44532
The year has advanced by one cycle. In accordance with this
practice, we increment the value of the bounding set of our
license year by one.
PR Close#44590