Can you chain a function after a transition without it being a part of the transition?

Question

For instance if I wanted to transition the yAxis domain I can do this

this.yAxis
    .transition()
    .call(this.createYAxis)
    .attr('transform', `translate( ${this.Axes.Y.offset}, 0 )`);

I'd also like to set the text size in the same selection, but I don't want to animate the text size. Is this possible in the same chain? For instance,

this.yAxis
    .transition()
    .call(this.createYAxis)
    .attr('transform', `translate( ${this.Axes.Y.offset}, 0 )`)
    //I don't want anything past this point to be a part of the transition
  .selectAll('text')
    .style('font-size', '15px');

Right now I'm just using two separate calls like so

this.yAxis
    .transition()
    .call(this.createYAxis)
    .attr('transform', `translate( ${this.Axes.Y.offset}, 0 )`);

this.yAxis.selectAll( 'text')
   .style( 'font-size', '15px' )

Answer 1

As of D3 v4 there is a method transition.selection() which

Returns the selection corresponding to this transition.

By means of this method you can break free from the transition started beforehand by selection.transition(). This enables continued method chaining acting on the selection instead of the transition.

var svg = d3.select("svg");

var scale = d3.scalePoint()
  .domain(["foo", "bar", "baz"])
  .range([30, 270]);

var axis = d3.axisBottom(scale);

var gX = svg.append("g")
  .transition()
    .duration(1000)
  .call(axis)
    .attr("transform", "translate(0,50)")
  .selection()   // <-- get the selection corresponding to the transition
    .style("font-size", "26px");

<script src="https://d3js.org/d3.v4.js"></script>
<svg></svg>