The search input has 50% width of the parent container in a focused
state for the big break point (> 1000px). In this case when window width
is between 1000px and 1115px the search input shrinks from 180 to
~123px. The width of the search input was increased to 80% so that when
focused its width expands from 180 to 196px when window size is 1000px.
Fixes#33305
PR Close#33804
By clearing `sessionStorage` and unsubscribing from `Location` events,
after each test, we reduce the possibility of potential
[spooky action at a distance][1]-type of failures in the future.
This does not have an impact on the actual app, since `ScrollService` is
currently expected to live throughout the lifetime of the app. Still,
unsubscribing from `Location` events keeps the code consistent with how
other `ScrollService` listeners are handled (e.g. for `window` events).
[1]: https://en.wikipedia.org/wiki/Action_at_a_distance_(computer_programming)
PR Close#33937
`ScrollService` subscribes to global `window` events and mutates global
state in the listener (e.g. read/write values from/to `sessionStorage`).
Therefore, we need to always call its `ngOnDestroy()` method to
unsubscribe from these events after each test.
In f69c6e204, a new testcase was introduced that was not destroyed. As a
result, random failures started to randomly happen in other, unrelated
tests ([example CI failure][1]).
This commit fixes this by ensuring all `ScrollService` instances are
destroyed after each tests (provided that they are created with the
`createScrollService()` helper).
[1]: https://circleci.com/gh/angular/angular/533298
PR Close#33937
Whenever cookies are disabled in the browser, `window.sessionStorage` is not avaialable to the app (i.e. even trying to access `window.sessionStorage` throws an error).
To avoid breaking the app, we use a no-op `Storage` implementation if `window.sessionStorage` is not available.
Fixes#33795
PR Close#33829
Reference #33259
Removes figures elements as AIO is not typically using captions or image groups where figures would be necessary or appropriate
PR Close#33748
PR#28396 originally addressed an update via issue #23983 to make images more visible with a white background (implementation of gray "lightbox").
This PR implements those styles defined in PR#28396.
PR Close#33259
Previously, when navigating to a new page via a link, the scroll
position was correctly restored to 0, but navigating to a new page via
typing the URL in the browser address bar keeps the old scroll position.
This commit ensures that the scroll position is restored to 0 whenever
the `ScrollService` is instantiated anew (i.e. new page navigation). The
old behavior of retaining the scroll position on reload is kept by
storing the old URL when leaving a page and only applying the stored
scroll position if the new URL matches the stored one.
Fixes#33260
PR Close#33344
Prior to this fix, all style/class bindings (e.g. `[style]` and
`[class.foo]`) would quietly update a binding value if and when the
current binding value changes during checkNoChanges.
With this patch, all styling instructions will properly check to see
if the value has changed during the second pass of detectChanges()
if checkNoChanges is active.
PR Close#33103
Prior to this change, a static attribute that corresponds with a
directive's input would not be type-checked against the type of the
input. This is unfortunate, as a static value always has type `string`,
whereas the directive's input type might be something different. This
typically occurs when a developer forgets to enclose the attribute name
in brackets to make it a property binding.
This commit lets static attributes be considered as bindings with string
values, so that they will be properly type-checked.
PR Close#33066
In #33066 a limitation of Ivy's template type checker was fixed, where
all directive inputs would incorrectly allow `undefined` to be passed,
even when the input's type did not allow for it. Due to the fix, some
additional type errors were uncovered in AIO, where potential
`undefined` values would be passed to inputs that were not typed to
allow `undefined`.
PR Close#33066
Previously, some spies in `DovViewerComponent` tests would return the
same `of(undefined)` observable for all invocations of the spy in a
test. While there is usually only one invocation per spy in each test,
this is not always the case. In case of multiple invocations within the
same test, subsequent calls would return an already completed
observable, which deviates from the actual behavior of the spied
function.
This commit fixes it by ensuring a fresh `of(undefined)` observable is
returned on each invocation.
PR Close#32980
`System.import()` has been deprecated in webpack and produces the
following warning when building the app:
```
WARNING in ./src/app/custom-elements/code/pretty-printer.service.ts
System.import() is deprecated and will be removed soon. Use import()
instead.
```
Switching to `import()` to get rid of the warning.
Fixes#30365Closes#30419
PR Close#32923
In 1c3ee4190, the `getting-started` guide/tutorial was renamed to
`start`, but the corresponding CSS class that controls the display of
the top-left hamburger (and it automatically derived based on the URL)
was not updated.
This commit updates the class to ensure that the hamburger is not hidden
when navigating to the getting started guide.
PR Close#32941
The Table of Contents (ToC) is auto-generated based on the content of
heading elements on the page. At the same time, anchor links are
auto-generated and added to each heading element. Note that the Material
Icons used for the anchor icon make use of ligatures, which means that
the icons are specified by using their textual name as text content of
the icon element. As a result, the name of the icon is included in the
parent element's `textContent`.
Previously, the `TocService` used to strip off these anchor elements
when generating the content of ToC items, but not when generating the
content of their tooltips. Thus, tooltips for ToC items would
confusingly include a `link` suffix (`link` is the textual name of the
icon used in heading anchor links).
This commit fixes this by deriving the tooltip content from the
transformed text content (which already has anchor links stripped off),
instead of from the original heading content.
PR Close#32418
TestBed.get is not type safe, fixing it would be a massive breaking
change. The Angular team has proposed replacing it with TestBed.inject
and deprecate TestBed.get.
Deprecation from TestBed.get will come as a separate commit.
Issue #26491Fixes#29905
BREAKING CHANGE: Injector.get now accepts abstract classes to return
type-safe values. Previous implementation returned `any` through the
deprecated implementation.
PR Close#32200
- Change margin to the header so that the the label aligns with the header
- Make code in API pages pre-wrap so that you can see the actual text on the screen - helps with issue #27296
- Modified text to be title case in label API to be consistent with rest of app labels
- Removed unused table of contents SCSS file
- TOC SCSS file reorg cleanup
- Soften headers font-weight in API pages
- Make linenums ordered list inside code examples always show as numbers
PR Close#31013
Previously, `linenums` defaulted to true if the content was more than 10
lines long and false otherwise.
Since in most cases linenums add unnecessary visual noise, this commit
changes `linenums` to always default to false (regardless of the size of
the content). It can be still be turned on by explicitly setting to true
or a number.
PR Close#31674
- Make docs cards expand to full width in smaller screen sizes.
- Reduce spacing around card container to match general spacing patterns seen in angular.io.
- Improve SCSS formatting.
PR Close#31576
This commit updates the necessary config files to run the angular.io and
docs tooling unit tests in random order (and fixes the tests that were
failing due to their dependence on the previous ordered execution).
Besides being a good idea anyway, running tests in random order is the
new [default behavior in jasmine@3.0.0][1], so this commit is in
preparation of upgrading jasmine to the latest version.
[1]: https://github.com/jasmine/jasmine/blob/v3.0.0/release_notes/3.0.md#breaking-changes
PR Close#31527
- Add more spacing to inputs.
- Correct placeholder colors in inputs.
- Add aria label to input for accessibility.
- Clean up layout styles and mobile view.
Fixes#31265
PR Close#31272
The `ScrollService` sets up some global `window` listeners.
Previously, these listeners were never unregistered. This was not a
problem in the real app, because the `ScrollService` instance exists for
the lifetime of a user session. In tests, however, where the `window`
instance is among all tests, the listeners would survive the
`ScrollService` tests. This, in addition to the fact that we used a mock
`ViewportScroller` which did not return the expected type from
`getScrollPosition()`, caused errors to be thrown in unrelated tests
(i.e. whenever a scroll event was emitted on `window`). See [here][1]
for an example failure.
This commit fixes it by adding an `ngOnDestroy()` method that
unregisters the listeners and ensuring it is called after each
`ScrollService` test.
[1]: https://circleci.com/gh/angular/angular/381649
PR Close#31390
Previously, the `search-results` layout was switch from horizontal to
vertical at 480px. Yes, since some search queries can yield more than 5
`.search-area`s, even 600px are too narrow to accomodate a horizontal
layout.
This commit changes the breakpoint at which the layout switches to
vertical from 480px to 600px.
PR Close#31390
Previously, `.search-area` had a default style of `display: flex`, but
it was overriden to `display: block` in media queries for
`max-width: 480px` and `min-width: 600px`. As a result, it only had
`display: flex` between 481px and 599px.
Since no flex layout features are necessary inside `.search-area`, this
commit changes the style to always be `display: block` (i.e. the default
for `div` elements).
PR Close#31390
In #31118, some vendor-specific selectors were combined in one rule-set.
As pointed out in [this comment][1], this would result in the whole
rule-set being ignored by all browsers, since one invalid/unrecognized
selector invalidates the declaration block.
This commit fixes it by defining a separate rule-set per selector. The
list of vendor-specific selectors is also adjusted to better target the
currently supported browsers.
[1]: https://github.com/angular/angular/pull/31118/files#r296923652
PR Close#31252